@charset "UTF-8";
.mobileWrap .mobileList{}
.mobileWrap .mobileList ul{display: flex; gap: 20px; flex-wrap: wrap;}
.mobileWrap .mobileList ul li{width: calc( 50% - 10px); height: 160px; border-radius: 16px; background: #fff; border: 1px solid #ddd; padding: 32px; display: flex; flex-direction: column; justify-content: space-between; }
.mobileWrap .mobileList ul li .title{font-size: 2.2rem; font-weight: 700; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 54px;  word-break: break-all; }

.mobileWrap .mobileList ul li .title > a{display:inline-block; width: calc(100% - 30px);overflow-x: hidden;text-overflow: ellipsis;white-space: nowrap;}
.mobileWrap .mobileList ul li p.person{background: url(../images/icon_person.svg) no-repeat left center; padding-left: 20px;font-weight: 700;font-size: 1.6rem;}
.mobileWrap .mobileList ul li p.person.noApply{font-weight: 500; color:#9E9E9E;}
.mobileWrap .mobileList ul li .info.info02{display: flex;align-items: center;justify-content: space-between;}
.mobileWrap .mobileList ul li .info .approve {color: #5170EB;}
.mobileWrap .mobileList ul li .info .reject{ color: #F66C84;  }
.mobileWrap .mobileList ul li .info .date{ font-weight: 500; color: #999; font-size: 1.6rem;}
.mobileWrap .mobileList ul li .info span{font-weight: 700;font-size: 1.6rem;}
.mobileWrap .mobileList ul li .info span + span::before{content: ""; display: inline-block; vertical-align: middle; width: 2px; height: 2px; border-radius: 50%; background: #332a26; margin: 0 6px;}
.mobileWrap .noData {text-align:center; align-content: center; height:200px; font-size : 2rem; font-weight:500; width:100%;}



.tokenWrap {background:#fff;border-radius:16px;padding-bottom:10px;} 
.mobileWrap .tokenList ul{display: flex; gap: 20px; flex-wrap: wrap;}
.mobileWrap .tokenList ul li{width: calc( 50% - 10px);margin:0 10px;height: 160px; border-bottom: 1px solid #ddd; padding: 32px; display: none; flex-direction: column; justify-content: space-between; }
.mobileWrap .tokenList ul li.on{display:flex;}
.mobileWrap .tokenList ul li .title{font-size: 2.2rem; font-weight: 700; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 54px;  word-break: break-all; }

.mobileWrap .tokenList ul li .title > a{display:inline-block; width: calc(100% - 30px);overflow-x: hidden;text-overflow: ellipsis;white-space: nowrap;}
.mobileWrap .tokenList ul li p.person{background: url(../images/icon_person.svg) no-repeat left center; padding-left: 20px;font-weight: 700;font-size: 1.6rem;}
.mobileWrap .tokenList ul li p.person.noApply{font-weight: 500; color:#9E9E9E;}
.mobileWrap .tokenList ul li .info .date{ font-weight: 500; color: #999; font-size: 1.6rem;}
.mobileWrap .tokenList ul li .info span{font-weight: 700;font-size: 1.6rem;}
.mobileWrap .tokenList ul li .info span.price::before{content: ""; display: inline-block; vertical-align: middle; width: 2px; height: 2px; border-radius: 50%; background: #332a26; margin: 0 6px;}
.mobileWrap .tokenList ul li.buy .title > a{color:#5170EB}
.mobileWrap .tokenList ul li.used .title > a{color: #F66C84; }
.mobileWrap .tokenList ul li .info span.count{float:right; font-size:2rem;}
.mobileWrap .tokenList ul li.buy .count {color: #5170EB; } 
.mobileWrap .tokenList ul li.used .count {color: #F66C84;} 
.mobileWrap .tokenList ul li .moreBtn:before{display:block;content:'';background: url(../images/icon_more_menu.svg) no-repeat; rotate:90deg; width:20px;height:20px;}


.moreBtn:before{display:block;content:'';background: url(../images/icon_more_menu.svg) no-repeat; width:20px;height:20px;}
.moreWrap{display: none;flex-direction:column;position: absolute;box-shadow: 0 0 5px rgba(39, 91, 235, 0.2); width:100px;height:auto;z-index:9; font-size:1.6rem;font-weight: 600; top: 0;right: 20px; }
.moreWrap.on{display:flex;}
.moreWrap > a .jp{display: block;font-weight: 400;}
.moreWrap > a{width:100% !important; height:48px; display:flex;align-items:center; background:#fff; border : 0.5px solid #DFE2ED; justify-content: center;flex : 1 0 auto;font-size:1.8rem;}
.moreWrap > a.jp{height:55px; flex-direction: column; justify-content: flex-end;}
.moreWrap > a:nth-child(n+2){border-top:0.5px solid #DFE2ED; }
@media (max-width: 1199px) {
.mobileWrap .mobileList ul{gap: 12px;}
.mobileWrap .mobileList ul li{width: 100%; padding: 20px; height: 150px;}
.mobileWrap .tokenList ul{gap: 0;}
.mobileWrap .tokenList ul li{width: 100%; padding: 20px; height: 100px;}
.statIcon{padding-left: 10px; text-align: left;vertical-align: middle;}	
}