*{margin: 0; border: 0; padding: 0; box-sizing: border-box;}
body{background-color: #0b0a0b; font-family: sans-serif, '맑은 고딕'; /* overflow-x: hidden; */ overflow-y: scroll;}
a{text-decoration: none;}
ul, li{list-style: none;}
.cf{display: block; content: ''; clear: both;}
.fl{float: left;}
.fr{float: right;}
body::-webkit-scrollbar{width: 6px;}
body::-webkit-scrollbar-thumb{background-color: #555; border-radius: 3px;}
body::-webkit-scrollbar-track{background-color: transparent;}
html.search-lock{position: fixed; overflow: hidden; width: 100%; top: 0; left: 0;}
  
/* 헤더 */
header{width: 100%; height: 70px; background-color: #201e21; position: fixed; z-index: 999; box-shadow: 1px 1px 1px #707070;}
.header_wrap{max-width: 1600px; width: 100%; height: 100%; margin: 0 auto;}
.header_wrap img{margin-top: 24px; margin-left: 20px; cursor: pointer;}

section{display: flex; flex-direction: row; max-width: 1600px; width: 100%; margin: 0 auto;}

/* 검색 입력창 */
#globalSearchWrap{z-index: 998;}
#searchIcon{position: relative; top: 9px; right: 50px; cursor: pointer; display: none;}
#globalSearch{width: 500px; height: 47px; background-color: #646464; margin-top: 12px; border-radius: 50px; padding: 10px 20px; font-size: 1.1em; font-weight: 500; color: #fff; border: none; outline: none; box-sizing: border-box; caret-color: #fff; cursor: pointer; border: 1px solid #aaa;}
#globalSearchWrap.active{position: fixed; top: 51px; left: 0px; width: 100%; height: calc(100vh - 51px); overflow-y: auto; overflow-x: hidden; background-color: rgba(0,0,0,0.95); z-index: 9999;}
#globalSearch::placeholder{font-size: 0.9em; color: #ccc; font-style: italic;}
#globalSearch:focus{box-shadow: 0 0 10px rgba(255, 255, 255, 0.5); background-color: #595959;}
#noResult{text-align: left; color: #fff; font-size: 1.2em; padding: 20px;}
#searchTabs{overflow-x: auto; -webkit-overflow-scrolling: touch;}
.tab_list{display: flex; flex-wrap: nowrap; gap: 10px; list-style: none; margin: 0; padding: 0 10px; white-space: nowrap; overflow-x: auto; scroll-behavior: smooth; cursor: grab; -webkit-overflow-scrolling: touch; scrollbar-width: none;}
.tab_list::-webkit-scrollbar{display: none;}
.tab_list.dragging{cursor: grabbing; user-select: none;}
.tab_list li{flex: 0 0 auto; cursor: pointer; padding: 10px 20px; background: #444; color: #fff; border-radius: 10px; white-space: nowrap;}
.tab_list li.active{background: #4336ff;}
.search_result_tab{margin-top: 20px; padding: 20px; background: rgba(255, 255, 255, 0.05); border-radius: 10px; color: #fff;}
#searchOverlay{position: fixed; top: 60px; left: 0; width: 100%; height: calc(100% - 60px); background: rgba(0, 0, 0, 0.95); overflow-y: auto; z-index: 1000; display: none;}
  
/* 사이드 메뉴 */
#side_menu{position: relative; max-width: 500px; overflow-y: auto; overflow-x: hidden; padding-top: 85px; z-index: 2;}
#side_menu a{display: block;}
#side_menu .menu_wrap{float: right; width: 330px; position: fixed; overflow-y: auto; max-height: calc(100vh - 85px); padding-right: 10px; scrollbar-gutter: stable; top: 75px; bottom: 0px;}
#side_menu .menu{cursor: pointer; border-radius: 5px; margin-top: 10px; margin-right: 10px; margin-bottom: 10px; padding: 15px; transition: 0.3s ease;}
#side_menu .menu .icon{position: absolute;}
    #side_menu .menu .left{margin-left: 2px;}
    #side_menu .menu .more{margin-top: -5px;}
    #side_menu .menu .top{margin-top: -2px;}
#side_menu .menu_wrap .menu:hover{background-color: #3e3c3f;}
#side_menu .menu.active{background-color: #3e3c3f;}
#side_menu .menu_wrap .menu.active:hover{background-color: #3e3c3f;}
#side_menu h4{font-size: 1.1em; color: #fff; font-weight: 600;}
#side_menu p{font-size: 1.1em; color: #fff; display: inline-block; margin-top: -2px; padding-left: 50px;}
#side_menu .down{display: none; }
    #side_menu .down p{width: 304px; font-size: 1em; display: block; color: #bbb; padding: 15px; border-radius: 5px; transition: 0.3s ease;  cursor: pointer;}
    #side_menu .down p.see{font-weight: bold; color: #4336ff;}
    #side_menu .down p .circle{display: inline-block; width: 10px; height: 10px; border-radius: 50px; background-color: #4336ff; margin-top: 7px; margin-right: 10px;}
    #side_menu .down p:hover{background-color: #3e3c3f; color: #fff;}
    #side_menu .down_btn{transition: transform 0.3s ease;}
    #side_menu .down_btn.rotate{transform: rotate(180deg);}
.menu_wrap::-webkit-scrollbar{width: 6px;}
.menu_wrap::-webkit-scrollbar-thumb{background-color: #555; border-radius: 3px;}
.menu_wrap::-webkit-scrollbar-track{background-color: transparent;}

/* 콘텐츠 영역 */
#content{max-width: 1600px; width: 100%; height: auto; position: relative; padding-top: 100px; padding-left: 350px; z-index: 1;}
.content_wrap{padding: 20px 50px;}

/* 남다 메뉴얼 */
#manual{width: 100%; height: auto; display: none;}
#manual h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#manual h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#manual .menual_quickguide{width: 1000px; padding: 30px; background-color: #201e21; margin-bottom: 50px;}
#manual .menual_guide{width: 1000px; padding: 30px; background-color: #201e21;}
#manual h4{font-size: 1.4em; color: #fff; margin-bottom: 15px;}
#manual p{font-size: 1.1em; color: #f5f5f5; margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid #aaa; line-height: 1.8;}
#manual p:last-child{border-bottom: none; padding-bottom: 0px;}
#manual span{font-weight: bold;}
#manual img{margin-bottom: 40px;}
#manual a{font-size: 0.8em; font-weight: normal; text-decoration: underline; color: #ffffff;}

/* 남다 지갑 */
#sign_up{width: 100%; height: auto;}
#sign_up h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#sign_up h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#sign_up h4{width: 105px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#sign_up .step{display: block;}
#sign_up .second{display: inline-block;}
#sign_up p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#sign_up span{font-weight: bold; color: #fff;}
#sign_up a{font-size: 1em; font-weight: normal; text-decoration: underline; color: #ffffff;}
#sign_up .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#sign_up .under{text-decoration: underline; font-weight: normal; color: #bbb;}
#sign_up .step1, .step2, .step3, .step4, .step5, .step6, .step7, .step8, .step8-1, .step8-2{width: 975px; height: auto; margin-bottom: 100px;}

#wallet_home{width: 100%; height: auto;}
#wallet_home h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#wallet_home h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal;}
#wallet_home .home_page{position: relative; z-index: 1; margin-bottom: 80px; scale: 0.85; margin-left: -120px;}
#wallet_home h4{width: 120px; color: #fff; background-color: #4336ff; padding: 5px 15px; border-radius: 50px; text-align: center; margin-bottom: 7px; position: absolute; z-index: 2; margin-left: 7px;}
#wallet_home p{color: #fff; background-color: #434343; border-radius: 10px; padding: 15px 15px; margin-top: 25px;}
#wallet_home .desktop_only{display: flex;}
#wallet_home .mobile_only{display: none;}
#wallet_home .no1{ position: absolute; top: 69px; left: 91px;}
#wallet_home .no2_1{ position: absolute; top: -2px; left: 814px;}
#wallet_home .no2_2{ position: absolute; top: 118px; left: 814px;}
#wallet_home .no2_3{ position: absolute; top: 239px; left: 814px;}
#wallet_home .no2_4{ position: absolute; top: 359px; left: 814px;}
#wallet_home .no3_1{ position: absolute; top: 205px; left: 76px;}
#wallet_home .no3_2{ position: absolute; top: 325px; left: 76px;}
#wallet_home .no3_3{ position: absolute; top: 424px; left: 76px;}
#wallet_home .no4_1{ position: absolute; top: 572px; left: 129px;}
#wallet_home .no4_2{ position: absolute; top: 695px; left: 191px;}
#wallet_home .no4_3{ position: absolute; top: 695px; left: 449px;}
#wallet_home .no4_4{ position: absolute; top: 695px; left: 700px;}
#wallet_home .no4_5{ position: absolute; top: 572px; left: 805px;}

#deposit{width: 100%; height: auto;}
#deposit h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#deposit h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#deposit h4{width: 100px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#deposit .step{display: block;}
#deposit .second{display: inline-block;}
#deposit p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#deposit span{font-weight: bold; color: #fff;}
#deposit .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#deposit .under{text-decoration: underline; font-weight: normal; color: #bbb;}
#deposit .step1, .step2, .step3, .step4{width: 975px; height: auto; margin-bottom: 100px;}

#recharge{width: 100%; height: auto;}
#recharge h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#recharge h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#recharge .cs{display: block; margin: 0 auto; margin-top: 100px; margin-left: 250px;}
#recharge h4{width: 100px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#recharge .step{display: block;}
#recharge .second{display: inline-block;}
#recharge p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#recharge span{font-weight: bold; color: #fff;}
#recharge .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#recharge .under{text-decoration: underline; font-weight: normal; color: #bbb;}
#recharge .step1, .step2, .step3, .step4, .step5{width: 975px; height: auto; margin-bottom: 100px;}

#withdraw{width: 100%; height: auto;}
#withdraw h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#withdraw h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#withdraw h4{width: 100px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#withdraw .step{display: block;}
#withdraw .second{display: inline-block;}
#withdraw p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#withdraw span{font-weight: bold; color: #fff;}
#withdraw .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#withdraw .under{text-decoration: underline; font-weight: normal; color: #bbb;}
#withdraw .step1, .step2, .step3, .step4, .step5{width: 975px; height: auto; margin-bottom: 100px;}

#swap{width: 100%; height: auto;}
#swap h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#swap h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#swap h4{width: 100px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#swap .step{display: block;}
#swap .second{display: inline-block;}
#swap p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#swap span{font-weight: bold; color: #fff;}
#swap .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#swap .step1, .step2, .step3, .step4, .step5{width: 975px; height: auto; margin-bottom: 100px;}

#information{width: 100%; height: auto;}
#information h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#information h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#information h4{width: 100px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center;/*  margin: 0 auto; */ margin-bottom: 15px;}
#information .mobile_only{display: none;}
#information .step{display: block; /* margin: 0 auto; */}
#information .second{display: inline-block;}
#information p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; text-align: left;}
#information span{font-weight: bold; color: #fff;}
#information .small{display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#information .step1, .step2, .step3, .step4, .step5{width: 975px; height: auto; margin-bottom: 100px; /* text-align: center */;}

#wallet_nav{display: block; position: relative; z-index: 3; top: 100px; left: -240px; color: #fff;}
.right_menu{display: none; position: fixed;}
.right_menu.view{display: block;}
.right_menu p{display: block; font-size: 0.9em; color: #aaa; width: 300px; margin-bottom: 20px; cursor: pointer;}
.right_menu .now{font-weight: bold; color: #fff;}
.right_menu .soon{font-size: 0.85em; color: #666;}

/* 플랫폼 */
#platform h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#platform h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#platform h4{display: inline-block; width: 145px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 20px; text-align: center; margin-bottom: 15px;}
#platform .title{display: block;}
#platform h5{display: inline-block; font-size: 1.2em; color: #fff; margin-top: 20px; margin-left: 10px; margin-right: 200px; margin-bottom: 10px;}
#platform img{display: block;}
#platform p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 15px; text-align: left;}
#platform .no{margin-bottom: 0px;}
#platform span{font-weight: bold; color: #fff;}
#platform .small{display: block; display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#platform .mobile_only{display: none;}
#platform .mobile_only .small{display: block; display: block; font-size: 1em; color: #bbb; background: none; padding: 0px 0px; margin-top: 10px;}
#platform .p_wrap{width: 100%;}
#platform .mb{margin-bottom: 100px;}
#platform .img_wrap>img{margin-right: 10px;}

#platform_nav{display: none; position: relative; z-index: 3; top: 100px; left: -240px; color: #fff;}
.right_menu{display: none; position: fixed;}
.right_menu.view{display: block;}
.right_menu p{display: block; font-size: 0.9em; color: #aaa; width: 300px; margin-bottom: 20px; cursor: pointer;}
.right_menu .now{font-weight: bold; color: #fff;}
.right_menu .soon{font-size: 0.85em; color: #666;}

/* 제휴사 */
#partners h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#partners h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#partners h2>a{color: #fff; text-decoration: underline;}
#partners h4{width: 145px; background-color: #4336ff; color: #fff; border-radius: 50px; padding: 10px 15px; text-align: center; margin-bottom: 15px;}
#partners p{display: inline-block; font-size: 1.2em; background-color: #434343; color: #f2f2f2; border-radius: 10px; padding: 10px 15px; margin-top: 20px; margin-bottom: 40px; text-align: left;}
#partners span{font-weight: bold; color: #fff;}

/* 공지사항 */
#notices{width: 100%; height: auto; display: none;}
#notices h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#notices h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 50px;}
#notices h4{font-size: 1.4em; color: #fff; font-weight: bold; margin-bottom: 10px;}
#notices table{width: 100%; border-collapse: collapse;}
#notices th, td{padding: 1rem; border-bottom: 1px solid #aaa; text-align: center;}
#notices th{background-color: #4336ff; color: #fff; font-weight: 600; font-size: 1.1em; padding: 0.8rem;}
#notices th:first-child{border-top-left-radius: 12px;}
#notices th:last-child{border-top-right-radius: 12px;}
#notices td{background-color: #201e21; color: #fff;}
#notices .details{display: none;}
#notices .details-row{height: 0; padding: 0; border: none; overflow: hidden;}
#notices .details-row td{padding: 0; border: none;}
#notices .details-content{display: none; padding: 1.2rem; background-color: #666; color: #fff; text-align: left;}
#notices .notice-row{cursor: pointer; background-color: #fafafa;}
#notices .notice-row:hover{background-color: #f0f0f0;}
#notices img{padding: 40px;}
#notices p{font-size: 1.5em; font-weight: bold; color: #ddd; margin-top: -20px; padding-bottom: 40px;}

/* FAQ */
#FAQ{width: 100%; height: auto; display: none;}
#FAQ h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#FAQ h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#FAQ .category{margin-top: 80px; box-sizing: border-box;}
#FAQ .category>div{display: inline-block; border: 2px solid #aaa; border-radius: 50px; margin-right: 15px; margin-bottom: 25px; cursor: pointer;}
#FAQ .category>div.active{background-color: #4336ff; border: 2px solid #4336ff;}
#FAQ .category>div.active:hover{background: #4336ff;}
#FAQ .category>div:hover{background-color: #52525B;}
#FAQ .category>div p{font-size: 1.1em; padding: 5px 20px; color: #f2f2f2;}
#FAQ .QnA{width: auto; background: #201e21; font-size: 1.5em; font-weight: bold; color: #fff; padding: 10px 20px 0px 20px; border-radius: 10px; margin-bottom: 30px; cursor: pointer;}
#FAQ .QnA span{font-size: 1em; font-weight: bold; color: #574fcc; margin-top: 2px;}
#FAQ .QnA p{font-weight: normal;}
#FAQ .QnA .q{display: block; padding-bottom: 10px;}
#FAQ .QnA .q>img{display: inline-block; margin-left: 100px; border-radius: 50px; background: #707070; padding: 5px; margin-top: 5px; transition: transform 0.3s ease;}
#FAQ .QnA .q>img.rotated{transform: rotate(45deg);}
#FAQ .QnA .q>p{width: 940px; margin-top: 5px; margin-left: 0px; font-size: 1em;}
#FAQ .QnA .a{display: none; border-top: 2px solid #52525B; padding-top: 15px; padding-bottom: 20px;}
#FAQ .QnA .a>span{font-size: 1em;}
#FAQ .QnA .a>p{font-size: 0.8em; font-weight: normal; color: #ddd; margin-left: 40px; padding-top: 5px; margin-bottom: 10px;}
#FAQ .QnA .a>img{padding-left: 40px;}

/* 고객센터 */
#customer{width: 100%; height: auto; display: none;}
#customer h1{font-size: 2em; color: #fff; margin-top: -5px; margin-bottom: 10px;}
#customer h2{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-bottom: 40px;}
#customer h3{font-size: 1.1em; color: #d0d0d0; font-weight: normal; margin-top: 80px; margin-bottom: 20px;}
#customer p{display: block; font-size: 1.4em; font-weight: bold; text-align: center; margin-right: 20px; margin-top: 5px;}
#customer a{color: #aaa; transition: transform 0.3s ease;}
#customer img{margin-right: 40px; border-radius: 20px;}
#customer img.hover-fade{opacity: 0.7; transition: opacity 0.3s ease;}
#customer img.hover-fade:hover{opacity: 1;}
#customer .img_wrap{position: relative; display: inline-block;}
#customer .p_wrap p{font-size: 1.2em; color: #fff; text-align: left; font-weight: normal; margin-bottom: 40px;}