/* header */
.header{width:100%;}
.header_common_safe_area{width:100%; height:50px;}
.header_common_layout{width:100%; max-width:768px; height:50px; padding:0 20px; position:fixed; left:50%; top:0; transform:translateX(-50%); background-color:black; z-index:998; display:flex; justify-content:center; align-items:center;}
.header_logo{font-size:18px; font-weight:700; display:flex; justify-content: center; align-items: center; color:#F3F3F3;}
.header_logo img { width:30px; height:30px; object-fit: cover; display: block; margin-right: 5px;}
.header_title{ display:flex; justify-content: center; align-items: center; font-size:18px; font-weight:700; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); color: #F3F3F3;}
.header_title img { width:30px; height:30px; object-fit: cover; display: block; margin-right: 5px;}
.header_left{margin-right:auto;}
.header_left img{display:block; width:27px;}
.hamburger .line { width: 25px; height: 2px; background-color:var(--new_main); display: block; margin: 5px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.hamburger:hover { cursor: pointer; }
.header_left.back img{width:12px;}
.header_right{margin-left:auto;}
.header_right img{display:block; width:24px;}


/* card */
.card{padding:20px; background:var(--card_bg); border-radius:var(--radius-box);}
.card.gradient{padding:20px; background:var(--gradient); border-radius:var(--radius-box);}

/* info_card */
.info_card{ background:var(--card_bg); border-radius:var(--radius-box); box-shadow: 2px 4px 12px rgba(0,0,0,0.06);}
/* .info_card > div:first-child { padding:14px 20px;  } */
.responsive_330 { display: flex; justify-content: space-between; align-items: center; }
.info_card .title{display:flex; align-items:center; gap:10px;}
.info_card .title img{width:40px; height:40px; border-radius:50%; background: var(--white); border:1px solid var(--grayc);}
.info_card .amount{ display: flex; justify-content: flex-end; align-items: center; font-size:22px; font-weight:700; font-family:"montserrat";}
.info_card .desc{display: flex; justify-content: flex-end; align-items: center; font-size:14px; font-weight:500;}
.info_card.border_blue  { background: var(--new_main); }

.main_card_bottom {display: flex; justify-content: space-between; align-items: center; height:50px; background: rgba(255,255,255,0.7); width:100%; border-radius: 0 0 10px 10px;}
.main_card_bottom li { width: 100%; height: 100%; border-right: 1px solid var(--new_main);}
.main_card_bottom li:last-child { border:none; }
.main_card_bottom li a  { display: flex; align-items: center; text-align: center; justify-content: center; width:100%; height: 100%; font-size: 16px; font-weight: 500; }

/* banner */
.coin_swiper, .banner_swiper { width:100%; height:100%; }
.banner_swiper li { width:100%; height:100%; }
.banner_swiper li a { display: block; width: 100%; height:100%; margin: 0 auto; }
.banner_swiper li a img { display: block; border-radius: 10px; width:100%; height: 100%; aspect-ratio: 3 / 1; object-fit: contain;}
.coin_swiper .swiper-pagination { bottom: 0px !important; }
.coin_swiper .swiper-pagination-bullet { background: var(--grayc); }
.coin_swiper .swiper-pagination-bullet-active { background: var(--sub); }

/* direct_link_list */
.direct_link_list{width:100%; display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows: 1fr; gap:10px;}
.direct_link_list li { position: relative; border-radius:var(--radius-box); box-shadow:2px 4px 12px rgba(0,0,0,0.06);}
.direct_link_list .direct_txt { width:100%; font-size: 18px; font-weight: 700; color:var(--black);}
.direct_link_list .direct_txt.color_white { color: var(--white); }
.direct_link_list li a{width:100%; height:100%; padding:10px; font-size:14px; font-weight:700; display:flex; flex-direction:column; justify-content: space-between;}
.direct_link_list li a > div {width:100%; height:100%; display: flex; flex-direction: column; justify-content: space-between; }
.direct_link_list li a img{display:inline-block; width:50px; margin-left:auto;}
.direct_link_list .direct_txt.font_14 {font-size:14px;}
/* page : qna */
.qna_tab{width:100%; height:62px; display:flex; justify-content:center; align-items:center;}
.qna_tab li {width:100%; height:100%; border-bottom:2px solid var(--white);}
.qna_tab li a{display:block; width:100%; height:100%; font-size:16px; font-weight:700; line-height:60px; text-align:center; color:#8d97a0;}
.qna_tab .active{border-bottom-color:var(--new_main);}
.qna_tab li.active a { color:var(--grayf3);}
/* .qna_tab .active a{color:var(--main_blue);} */
.qna_list{width:100%;}
.qna_list li{ background: var(--white); border-radius: var(--radius-box); margin-bottom: 10px; }
.qna_list li:last-child { margin-bottom: 0; }
.qna_list a{display:block; padding:20px;}
.qna_list .title{margin-bottom:10px; font-size:16px; font-weight:700;}
.qna_list .info{display:flex; justify-content:space-between; align-items:center;}
.qna_list .info .state{font-size:14px; font-weight:500;}
.qna_list .info .date{font-size:14px; font-weight:500;}

.qna_view {width:100%;}
.qna_view li{ background: var(--white); padding: 0 20px; border-radius: 10px 10px 0 0; margin-bottom: 10px;}
.qna_view li:last-child { margin-bottom: 0; }
.qna_view a{display:block; padding:20px 0;}
.qna_view .title{margin-bottom:10px; font-size:16px; font-weight:700;}
.qna_view .info{display:flex; justify-content:space-between; align-items:center;}
.qna_view .info .state{font-size:14px; font-weight:500;}
.qna_view .info .date{font-size:14px; font-weight:500;}
.qna_view_top_txt { background: var(--white); padding: 20px; border-radius: 0 0 10px 10px; margin-bottom: 10px; }
.qna_admin_answer { background: var(--white); padding: 20px; border-radius: 10px 10px 0 0; }
/* send_card_list */
.send_card_list { width: 100%; padding: 16px; box-shadow:2px 4px 12px rgba(0,0,0,0.06); font-size: 14px; border-radius:var(--radius-box); background-color:var(--white);}
.send_card_list .title { flex: none; font-weight: 700; color: var(--gray); word-break: break-all; }
.send_card_list .desc { font-size: 14px; font-weight: 700; word-break: break-all; }
.send_card_list li { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--grayd); }
.send_card_list li:last-child { margin-bottom: 0; border: none; padding: 0; }


/* text_card_list */
.text_card_list{width:100%; padding:16px; background-color:var(--white); box-shadow:var(--card-shadow); border-radius:var(--radius-box);}
.text_card_list li{display:flex; justify-content:space-between; align-items:center; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid var(--line);}
.text_card_list li:last-child{padding-bottom:0px; margin-bottom:0px; border-bottom:none;}
.text_card_list .title{flex:none; font-size:14px; font-weight:400; color:#333; word-break: break-all;}
.text_card_list .desc{font-size:16px; font-weight:700; word-break: break-all;}

/* page : login */
.login_logo{width: 100%; font-size:38px; font-weight:700; text-align:center; font-family:"montserrat";}
.login_logo > img { width: 100%;}
/* .login_bg { background: #fdeabf; } */
.login_bg { background-color: #192330;}
.login_title_img { width:100px; height:100px; }
.login_title_txt { color:var(--new_main); margin-bottom: 30px; font-size: 28px;}
.design.login_join_btn { background:#192330; border:1px solid var(--new_main); color:var(--new_main); }

/* page : register */
.argree_box {height:90px; border:1px solid var(--bg); background: #F3F3F3; border-radius: var(--radius-box); font-size:14px; padding:10px; font-weight: 500; overflow-y: auto; }

/* page : notice */
.notice_list{width:100%; padding: 10px; background:var(--white); border-radius: var(--radius-box); box-shadow:2px 4px 12px rgba(0,0,0,0.06); color: var(--white);}
.notice_list li{width:100%; border-bottom:1px solid var(--line); }
.notice_list li:last-child { border:none; }
.notice_list li a{width:100%; padding:14px 20px; display:flex; justify-content:space-between; align-items:center; gap:10px;}
.notice_list li a .title{font-size:16px; font-weight:700; color: var(--black);}
.notice_list li a .date{font-size:14px; font-weight:500; flex:none; color: #818181;}

/* exchange_list */
.exchange_list{width:100%; overflow:hidden;}
.exchange_list_no_data{height:68px; text-align:center; border:1px solid var(--border_sub); display:flex; justify-content:center; align-items:center; font-size:18px; font-weight:700; border-radius:6px; box-shadow:1px 1px 2px rgb(226 226 226 / 30%);}
.exchange_list li{position:relative; margin-bottom:14px;}
.exchange_list li:last-child{margin-bottom:0px;}
.exchange_list_info{padding:10px 16px; border:1px solid var(--border_sub); border-radius:6px; box-shadow:1px 1px 2px rgb(226 226 226 / 30%); display:flex; align-items:center; cursor:pointer; position:relative; background-color:#fff; transition:transform 0.3s; display:flex; justify-content:space-between; align-items:center;}

.exchange_list_info .from{flex:none; width:calc(50% - 20px); padding:0 10px;}
.exchange_list_info .to{flex:none; width:calc(50% - 20px); padding:0 10px;}

.exchange_list_info .arrow{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}

.exchange_list_info .img{width:46px; height:46px; padding:6px; margin:auto; border:1px solid var(--border); border-radius:50%; display:flex; justify-content:center; align-items:center;}
.exchange_list_info .img img{display:block; width:100%; height:100%; object-fit:contain; object-position:center;}
.exchange_list_info .text{font-size:16px; font-weight:700; text-align:center;}

.exchange_list_info.active{transform:translateX(-170px);}

/* page : marketplace */
/* 230419 장터페이지 추가 작업 : 신정운 */
.giftcard_tab { display: grid; grid-template-columns: repeat(3,1fr); grid-column-gap: 10px; justify-content: center;}
.market_ul, .marketplace_view { display:flex; justify-content: space-between; align-items: center; padding:6px 10px; }
.market_ul li, .marketplace_view li { width:24%; }
.market_table ul { width:100%;}
.marker_border { position: relative; z-index:999; border-top:1px solid var(--line);}
.giftcard_active { outline:2px solid var(--main);}
.giftcard_tab img { max-width:100%;}

.market_tablewrap { border-radius: 10px; border:2px solid var(--line); overflow: hidden; }
.market_table { text-align: center; font-size:15px; transition: transform 0.3s; position: relative;  border-bottom:none; width:100%;
  word-break: break-all; overflow: hidden; z-index:990;}
.market_nohistory { width:100%; height:calc(100vh - 400px); display: flex; justify-content: center; align-items: center;}
.marketplace_view { transition: transform 0.3s; z-index:999; background-color:var(--card_bg);}
.marketplace_view.active { transform: translateX(-100%);}
.market_hight { height:100%;}

.type2 { border:1px solid var(--line); margin:20px 0; }
.viewbtn button { width:70px; height:30px; font-size:15px;}
.total_marketbox { display: flex; align-items: flex-end; position: absolute; right: 0; bottom:0; width:100%; z-index:-1;}
.total_listview {font-size:15px; border-radius: 8px; width:100%; padding:10px;}
.total_listview li { display:flex; border-bottom:1px solid var(--line); justify-content: space-between; padding:10px 0;}
.total_listview li:first-child { padding-top:0;  }
.total_listview li:last-child{ padding-bottom:0; border-bottom:none;}
.total_listview li p:nth-child(1) {width:25%;}
.total_listview li p:nth-child(2) {width:24%; margin-left:auto;}

.total_list_txt { width: max-content; box-shadow: 2px 4px 12px rgba(0,0,0,0.06); }

.market_ul{background-color:var(--card_bg);}
.market_ul .link_viewli, .marketplace_view  .link_viewli {width:10%;}
.market_ul li:nth-child(1), .marketplace_view li:nth-child(1) { width:12%;}
.market_ul li:nth-child(3), .marketplace_view li:nth-child(3) { width:10%;}
.market_ul li:nth-child(2), .marketplace_view li:nth-child(2) { width:65%;}
.market_ul .link_viewli, .marketplace_view  .link_viewli {width:5%;}

.card_80 { color:#d7b629; font-weight: 700; }
.card_120 { color:#7595cb; font-weight: 700; }
.card_160 { color:#ad667c; font-weight: 700; }
.card_180 { color:#66ad86; font-weight:700; }

.info_market {width:100%; text-align: right; font-size:16px; color:#ff0000; font-weight: 500;}
.view_linkimg img {width:30px; height:30px; display: block;}
.view_linkimg {cursor:pointer;}

.market_info_txt {font-size: 14px; font-weight: 500; text-align: right;}
.market_info_txt img { display: block; }

.market_list_view > button { background: #232323;; font-size: 16px; color:#818181;}
.market_list_view > button.active { background: var(--sub); font-size: 16px; color:var(--black);}
/* page : withdraw */
.withdraw_tab{width:100%; display:flex; justify-content:center; align-items:center; gap:20px;}
.withdraw_tab li{width:100%; height:50px; line-height:50px; border-radius:6px; text-align:center; background-color:var(--gray3); font-size:16px; font-weight:700; cursor:pointer;}
.withdraw_tab .active{background:var(--gradient);}

.withdraw_panel li{display:none;}
.withdraw_panel .active{display:block;}

.table_wrap { overflow-x: auto; font-size:14px; text-align: center; background-color:var(--white); border-radius:6px; box-shadow:2px 4px 12px rgba(0,0,0,0.06);}
.table_wrap table th { border-bottom:1px solid var(--new_body_bg); padding:14px 10px; white-space: nowrap; color :var(--black);}
.table_wrap table td { text-align: center; padding:14px 10px; border-bottom:1px solid var(--new_body_bg); white-space: nowrap; color: var(--black); }
.table_wrap table tr:last-child td{border-bottom:none;}

/* page : purchase */
.purchase_tab{display:flex; justify-content:center; align-items:center; gap:10px;}
.purchase_tab li{width:100%; height:52px; border-radius:6px; background:#4e5861; border:1px solid rgba(0,0,0,0.05); font-size:16px; font-weight:700; color:#AEAEAE; display:flex; justify-content:center; align-items:center; cursor:pointer;}
.purchase_tab .active{background:var(--new_main); color:var(--grayf3);}


/* swal */
.title_sweet { font-size:20px; color:#212121; }
.desc_sweet { font-size:15px; color:#212121; font-weight: 400; }
.swal2-styled { margin:0 !important; }
.swal2-actions:not(.swal2-loading) .swal2-styled:active { background-image: none !important; }
.swal2-styled.swal2-default-outline:focus, .swal2-styled.swal2-cancel:focus { box-shadow: none !important; }
.swal2-actions:not(.swal2-loading) .swal2-styled:hover { background-image: none !important; }
.swal2-actions .swal2-styled.swal2-cancel { margin-left:10px !important; border:1px solid var(--line); background-color: var(--new_main);}
.swal2-popup {width:400px !important;}
.swal2-styled.swal2-confirm {color:var(--white) !important; background-color: var(--new_main) !important;}

/* .swal2-title { padding: 30px 20px 0 !important;}
.swal2-container.swal2-center>.swal2-popup { padding-bottom:0 !important; width: calc(100% - 20px) !important; max-width:400px !important; min-height: 150px !important; max-height: 582px !important; background-color:var(--card_bg) !important;}
.swal2-styled { width: 100% !important; border-radius: var(--radius-btn) !important; font-size: 18px !important; font-weight: 700 !important; }
.swal2-actions { min-height: 90px !important; padding: 0 20px ! important; margin:0 auto !important; display: flex !important; justify-content: space-between !important; align-items: center !important; flex-wrap: nowrap !important; width: 100% !important; }
.swal2-html-container { margin: 0 !important; }
.swal2-title{font-size:22px !important;}
.swal2-styled.swal2-confirm{background:var(--sub) !important; color:var(--black) !important; outline: none !important; border-radius: var(--radius-btn) !important; font-size: 18px !important; font-weight: 700 !important;}
.swal2-popup .swal2-styled:focus { box-shadow: none !important; }
.title_sweet {  min-height: 40px !important;  font-weight: 700 !important; font-size: 18px !important; font-family: "Noto Sans KR" !important;}
.desc_sweet {  min-height: 30px !important;  padding: 0 20px !important; word-break: break-all !important; font-family: "Noto Sans KR", sans-serif !important; font-size: 16px !important; font-weight: 400 !important; max-height:156px !important; overflow: auto !important; } */
.sweet_cancel_btn  { background: var(--graya) !important; }
.swal2-shown {padding-right:0 !important;}

/* loading */
.loading{position:fixed; left:0; top:0; width:100%; height:100vh; background-color:var(--body_bg); z-index:10001;}
.loading_circle{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) rotate(0deg);width:100px; height:100px; border-radius:50%; border:2px solid var(--main); border-top-color:rgba(255,255,255,0); border-bottom-color:rgba(255,255,255,0); animation:loading 3s infinite;}
.loading_text{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:14px; font-weight:700; color:var(--black);}

/* keypad */
.keypad{display: grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr;}
.keypad button{display:block; width:100%; height: 78px; font-size:26px; font-weight:700; display:flex; justify-content:center; align-items:center; background:none; cursor:pointer;}
.keypad a {display:block; width: 100%; height: 78px; border-radius: unset; padding: 0; font-size: 26px; font-weight: 700; display: flex; justify-content: center; align-items: center;}

/* pin */
.pin_box span { display: block; width: 38px; height: 38px; border-radius: 6px; background-color: var(--line); margin-right: 6px; position: relative; overflow: hidden; }
.pin_box .active:before { content: "*"; text-align: center; line-height: 46px; font-size: 20px; color: var(--black); background:var(--main); position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

/* pagination */
.pagination_wrap { width: 100%; max-width: 768px; padding: 28px 0; margin: 0 auto; }
.pagination_item a {display:block; width:100%; height:100%; color:var(--black); display: flex; justify-content: center; align-items: center; font-size:14px; font-weight:700;}
.pagination_item.active a { background:var(--new_main); border-radius: 4px; font-family:'Montserrat', sans-serif; color: var(--black); }
.pagination_list { display: flex; justify-content: center; width: 170px; margin: 0 auto; gap:4px; }
.pagination_list li.pagination_item { display: flex; justify-content: center; align-items: center; width: 26px; height: 26px; font-size: 14px; font-family: 'Montserrat', sans-serif; color: var(--black); user-select: none; cursor: pointer; }
.pagination_item:first-child, .pagination_item:last-child { color: var(--black); }



/* popup */
.popup_wrap { display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; background-color: rgba(0,0,0,0.5); }
.pop_bg { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 8000; transition: all 300ms ease-in; }
.pop_cont { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width:calc(100% - 40px); max-width:400px; min-height: 300px; max-height: 582px; padding: 30px 20px 100px; background-color:var(--card_bg); border-radius:8px; z-index: 9920; }
.pop_title { font-weight: 700; text-align: center; padding-bottom: 20px; font-size: 18px; font-family: "Noto Sans KR", sans-serif; line-height: normal; }
.popup_txt { color: var(--black); word-break: break-all; font-family: "Noto Sans KR", sans-serif; line-height: normal; font-size: 16px; font-weight: 400; max-height:156px; overflow: auto;}
.pop_btn { position:absolute; bottom:30px; left: 50%; transform: translateX(-50%); width:calc(100% - 40px); display: flex; justify-content: space-between; align-items: center; padding-top: 20px; }
.pop_btn p { display: block; width: 48%; padding: 13px; text-align: center; color: var(--black); font-size: 16px; background-color: transparent; border-radius: 10px; cursor: pointer; font-weight: 700; }
.pop_btn p.allday_none_btn { background-color: var(--graya); color:var(--white); }
.pop_btn p:nth-child(2) { background-color: var(--sub); color:var(--black); }

/* bottom_tab */
.bottom_tab_safe_area{width:100%; height:70px;}
.bottom_tab{width:100%; max-width:768px; height:70px; border-top:1px solid #A8A8A8; position:fixed; left:50%; bottom:0; transform:translate(-50%,0); background-color:black;}
.bottom_tab ul{ width: 100%; height:100%; display:flex; justify-content:space-between; align-items:center;}
.bottom_tab ul li { width: 100%; height:100%; }
.bottom_tab ul li a{ width: 100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content: center; font-size:12px;  color:var(--gray8); }
.bottom_tab ul li a img{width:30px; height:30px;}
.bottom_tab ul .active a{color:var(--sub);}

/*tree*/
.seearch_img { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); cursor: pointer; }
.search_inputbox { position: relative; }
.container_tree { position: relative; overflow: auto; }
.tree1 ul { padding-top: 15px; position: relative; display: flex; }
.tree1 li { text-align: center; position: relative; padding: 18px 5px 0 5px; }
.tree_wrap { width:100%; max-width:768px; margin:0 auto; padding:0 10px; overflow:auto; }
.user_infom { word-break: break-all; border: 2px solid var(--grayc); display: inline-block; width: 120px; border-radius: 6px; }
.tree_idbox { display:flex; align-items: center; justify-content: center; padding:4px; border-radius: 4px 4px 0 0; color:var(--black); background-color:var(--grayc);
  min-height:30px; font-weight:600; height:auto; font-size:12px; }
.set1 { width:100%; height:1px; margin:0 auto; }
.tree_imgbox img { width:30px; margin:0 auto; display: block;}
.tree_imgbox, .tree_datebox { padding:4px 0; font-size:12px; font-weight:400; color: #818181;}
.tree_namebox { font-size:12px; font-weight:600; padding-top:4px; word-break: break-all; color: #A8A8A8; }
.tree_search { padding:0 20px; }
.tree_imgbox { border-bottom:1px solid var(--grayd); }
.container_tree { -ms-overflow-style: none; scrollbar-width: none; }
.container_tree::-webkit-scrollbar { display:none; }
/*li 단독속성 (ul의 지정요소가 그 부모의 유일한 자식요소인 경우) */
.tree1 li:only-child { padding-top: 0; margin: auto; }
/* after, before 이벤트 */
.tree1 li::before, .tree1 li::after { content: ''; position: absolute; top: 0; right: 50%; border-top: 2px solid var(--grayc); width: 50%; height: 18px; }
.tree1 li::after { right: auto; left: 50%; border-left: 2px solid var(--grayc); }
.tree1 li:only-child::after, .tree1 li:only-child::before { display: none; }
.tree1 li:first-child::before, .tree1 li:last-child::after { border:none; }
.tree1 li:last-child::before { border-right: 2px solid var(--grayc); border-radius: 0 5px 0 0; -webkit-border-radius: 0 5px 0 0; -moz-border-radius: 0 5px 0 0; }
.tree1 li:first-child::after { border-radius: 5px 0 0 0; -webkit-border-radius: 5px 0 0 0; -moz-border-radius: 5px 0 0 0; }
.tree1 ul ul::before { content: ''; position: absolute; top: 0; left: 50%; border-left: 2px solid var(--grayc); width: 0; height: 15px; }

/* hover 이벤트 */
.tree1 li a:hover+ul li::after, .tree1 li a:hover+ul li::before, .tree1 li a:hover+ul::before, .tree1 li a:hover+ul ul::before { border-color: var(--new_main); }
.tree1 li a div:hover, .tree1 li a:hover+ul li a div { border: 2px solid var(--new_main); cursor:pointer; }
.tree1 li a div:hover > p:nth-child(1) { background:linear-gradient(165deg, var(--new_main) 0%, var(--new_main) 100%); }
.tree1 li a:hover+ul li a div p:nth-child(1) { background:linear-gradient(165deg, var(--new_main) 0%, var(--new_main) 100%); }


/* market table 수정작업 : NBR */
.market_table_box { padding: 6px 20px; background-color: var(--card_bg); display: flex; justify-content: space-between; align-items: center;}
.market_tablewrap > p { background: var(--card_bg); }
.marketplace_view{border-bottom:1px solid rgba(255,255,255,0.5);}
.marketplace_list.active > div:first-child {border-bottom:1px solid rgba(255,255,255,0.5);}
.marketplace_view .first, .market_table_box .first { min-width: 20px; text-align: center;}
.marketplace_view .center, .market_table_box .center { min-width: 100px; width: 100%;  text-align: center;}
.marketplace_view .last, .market_table_box .last { max-width: 110px; width: 100%; text-align: center;}
.market_tablewrap.bg { background-color: var(--black); }
.marketplace_list { margin-bottom: 1px; position: relative; bottom: 0; border:none; box-shadow: none; width: 100%; height: 40px; line-height: 42px; -webkit-perspective: 230px; perspective: 230px;}
.marketplace_list:last-child { margin:0; }
.marketplace_list > div { padding: 0 20px; background: var(--card_bg); position: absolute; width: 100%; height: 40px; margin:0; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all .3s; transition: all .3s; }
.marketplace_list > div:nth-child(1) {-webkit-transform: rotateX(90deg); -moz-transform: rotateX(90deg); transform: rotateX(90deg); -webkit-transform-origin: 50% 50% -20px; -moz-transform-origin: 50% 50% -20px; transform-origin: 50% 50% -20px; }
.marketplace_list > div:nth-child(2) { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); -webkit-transform-origin: 50% 50% -20px; -moz-transform-origin: 50% 50% -20px; transform-origin: 50% 50% -20px; }
.marketplace_list.active > div:nth-child(1) { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); }
.marketplace_list.active > div:nth-child(2) { opacity: 0; color: transparent; -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); }
.marketplace_list button { width: 70px; height: 30px; font-size: 15px; }


/* 23.05.04 sidebar - NJH */
.dark_bg {display: none; position: fixed; width: 100%; max-width:768px; height: 100%; left:50%; top:0; transform:translateX(-50%); background-color: rgba(0,0,0,0.5); z-index: -1;}
.dark_bg.active {display: block; z-index: 1100;}
.sidebar_cont {position:absolute; left:-100px; top:50%; transform:translateY(-50%); width:300px; height: 100%!important; max-height: 100%; background-color: var(--new_main); color: var(--black); z-index:-1; opacity: 0; transition: 200ms ease; overflow-y: auto!important;}
.sidebar_cont.active {left: 0; opacity:1; z-index:1200; transition: 200ms ease;}
.sidebar_inner {position: absolute; width: 100%;top: 0;left: 0;  padding: 20px;}
.my_info {padding:20px; border-radius:10px; background-color: var(--blue8); }
.home_btn { padding:15px 20px;}
.sidebar_menu > li { border-radius:10px; color: var(--white);}
.sidebar_menu > li.active { background-color: var(--white); color: var(--new_main);}
.sidebar_menu_tit { padding: 15px 20px;}
.sub_menu {display: none;}
.sub_menu > li > a { padding:10px 20px 12px 22px; color: var(--black);}
.sidebar_cont { -ms-overflow-style: none; scrollbar-width: none; }
.sidebar_cont::-webkit-scrollbar { display:none; }

/* 추천하기 */
.bg_referral { background: #192330; }
.referral_tit { padding: 30px 20px 0; text-align: center; }
.referral_tit p:first-child { font-size: 38px; line-height: 1.2; }
.referral_tit p:last-child { font-size: 16px; }
.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_card { margin: 0 20px 0; padding: 14px 20px; background: var(--white); border-radius: 10px; }
.referral_info li { display: flex; align-items: stretch; }
.referral_num { flex:none; display: block; width: 21px; height: 21px; display: flex; justify-content: center; align-items: center; background: #89949C; font-size: 12px; font-weight: 600; font-family: "montserrat"; border-radius: 50%; color:var(--white); }
.referral_info li { font-size: 14px; 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; }
.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.05.22 datepicker 추가 NBR */
.clearfix { display:flex; justify-content: center; align-items: center; }
.clearfix input:read-only { width: 100%; padding: 12px 25px; box-shadow: var(--input-shadow); border: var(--input-border); border-radius: 6px; font-size: 16px; font-weight: 500; font-family: "Noto Sans KR", sans-serif; background: var(--white);  text-align: center; color: #A8A8A8;}
.clearfix .demi { margin: 0 10px; }
.clearfix .dset { width:100%;}
.searchDate { width: 100%; display: flex; align-items: center;}
.searchDate li { position:relative; width: 100%; height: 52px; margin-right: 10px; border-radius: 8px; border: 1px solid var(--new_main); box-shadow: 2px 4px 12px rgba(0,0,0,0.06); color:var(--new_main);}
.searchDate li.active { border-color: var(--new_main); color:var(--white); background: var(--new_main); }
.searchDate li:last-child { margin: 0 ; }
.searchDate input { display: none; }
.searchDate label { position:absolute; left: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; cursor: pointer; font-size: 14px; font-weight: 500; }

/*230720 신정운 */
/* progress bar */
/* .progress_box {width:100%; padding: 20px; background-color:#2D2D2D; border-radius: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);} */
.progress_box {width:100%; padding: 20px; background-color:none; border: 1px solid var(--new_main); border-radius: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);}
.progress_box li:nth-child(odd){display: flex; justify-content: space-between; alig.progress_boxn-items: center;}
.progress_bar{width:100%; margin:10px 0; background-color: #EAEAEA; border-radius: 20px; position: relative;}
.gage_bar { width: 0%; height:20px; background-color:var(--new_main); border-radius: 20px; transition: width 1s;}
.progress_top p, .progress_figures p:first-child {color:var(--new_main);}
.gage_txt {position: absolute; left:10px; top:-2px; font-weight: 700;}

.select_design { background-color: var(--white); width:100%; padding:12px 25px; box-shadow:var(--input-shadow); border:var(--input-border); border-radius:6px; font-size:16px; font-weight:500; font-family: "Noto Sans KR", sans-serif; cursor:pointer; color: #646464;}
.select_design::placeholder{color:#A8A8A8;} 
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(../img/svg/icon_drop.svg) no-repeat 98% 50%/20px auto;
	background-size: 10px;
}

.notranslate {
  color: var(--grayf3);
}

/* 수당내역*/

.allocation_btn_list {display: flex; align-items: center;}
.allocation_btn{cursor: pointer; display: flex; align-items: center; justify-content: center; word-break: keep-all; text-align: center;
  position:relative; width: 100%; height: 52px; margin-right: 10px; border-radius: 8px; border: 1px solid var(--new_main);
  box-shadow: 2px 4px 12px rgba(0,0,0,0.06); color:var(--new_main);
}
.allocation_btn.active{ border-color: var(--new_main); color:var(--white); background: var(--new_main); }
.allocation_conts {display: none; width: 100%; border-collapse: collapse;}
.allocation_conts.active {display: table;}
.allocation_conts thead, .allocation_conts_list, .allocation_conts_wrap{width: 100%;}
.allocation_conts th,
.allocation_conts td {padding: 8px; text-align: center; width: auto;}

/* withdraw */
.point_box {padding: 30px 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; background: linear-gradient(120deg, #259839, #00874f);
  width: 100%; border-radius: 6px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.28); overflow: hidden;
}

.point_title{font-size: 16px; font-weight: 600;}
.amount {color: #fff; font-size: 20px; font-weight: 700;}
.amount::placeholder{color:#fff; text-align: right; font-size: 20px; font-weight: 700;}

@media screen and (max-width:767px) {
	select { background: url(../img/svg/icon_drop.svg) no-repeat 94% 50%/20px auto; background-size: 10px;}
  .direct_link_list{width:100%; display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:10px;}
.direct_link_list li a img{display:inline-block; width:34px; margin-left:auto;}
.direct_link_list{width:100%; display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:10px;}
.direct_link_list li a img{display:inline-block; width:34px; margin-left:auto;}
.send_card_list li { flex-direction: column; align-items: flex-start; }
.text_card_list li{display:block;}
.text_card_list .title{margin-bottom:10px;}
.d_none_500{display:block;}

}

/*@@@@@@@@@@@@@@@@@@@@@ 모바일 @@@@@@@@@@@@@@@@@@@@@*/
@media all and (min-width:320px) and (max-width:480px){
  .direct_link_list{width:100%; display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:10px;}
  .direct_link_list li a img{display:inline-block; width:34px; margin-left:auto;}
  .send_card_list li { flex-direction: column; align-items: flex-start; }
  .text_card_list li{display:block;}
  .text_card_list .title{margin-bottom:10px;}
  .direct_link_list li{aspect-ratio:1/1;}

  .d_none_500{display:block;}
  .d_none_480{display:block;}
  .d_none_375{display:block;}
  .d_none_360{display:block;}
  .d_none_330{display:block;}
  .d_none_320{display:block;}
}

@media all and (max-width:340px) {
  .direct_link_list .direct_txt { font-size: 14px; }
  .direct_link_list li a img{display:inline-block; width:34px; margin-left:auto;}
}

@media all and (max-width:320px) {
  .direct_link_list{width:100%; display:grid; grid-template-columns:repeat(2,1fr); grid-auto-rows:1fr; gap:10px;}
}