.main-container .main-left .sect-wrap {margin-bottom: 24px;}
.main-container .main-left .sect-wrap .top-wrap {margin-bottom: 20px;}
.main-container .main-left .sect-wrap .top-wrap .tit-box {display: flex; align-items: center; gap: 0 1%; padding-bottom: 25px; font-size: 20px; font-weight: 700;}
.main-container .main-left .sect-wrap .top-wrap .tit-box img {width: 26px; height: 26px;}

.main-container .main-left .sect-wrap .top-wrap .myrank-box {display: flex; align-items: center; gap: 0 10px; padding: 16px 30px; border: 1px solid #F68779; border-radius: 12px; box-shadow: 0px 2px 8px 0px #F35F4C33; font-size: 16px;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area {display: flex; justify-content: space-between; width: 100%;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .txt-box {display: flex; align-items: center; gap: 0 10px; font-size: 16px;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .box1 {width: 70%; font-weight: 600;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .box1 .mb-profile-img {width: 42px; height: 42px; border-radius: 8px; margin-right: 10px;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .box1 a{
	display: flex;
    align-items: center;
}
/* .main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .box2 {} */
.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .box2 .txt2 {padding: 6px 12px; width: 100px; border-radius: 8px; text-align: center; background-color: #F5F6FA; font-weight: 600;}

/* .main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .box3 {}` */
.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .box3 .txt2 {padding: 6px 12px; width: 100px; text-align: center; border-radius: 8px; background-color: #FEF2F1; font-size: 16px; font-weight: 700; color: #F03A23;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .box3 .txt2 .txt2-1 {font-size: 14px; font-weight: 600; color: #000;}
.main-container .main-left .sect-wrap .top-wrap .myrank-box .box-btn {display: flex; align-items: center;  padding: 6px 12px; border-radius: 8px; background-color: #F35F4C; color: #fff; flex-shrink: 0;}


.main-container .main-left .sect-wrap .content-wrap {border-top: 2px solid #1F2124; border-radius: 2px;}
.main-container .main-left .sect-wrap .content-wrap .w-rank {width: 5%; text-align: center;}
.main-container .main-left .sect-wrap .content-wrap .w-nick {padding-left: 20px; width: 25%;}
.main-container .main-left .sect-wrap .content-wrap .w-nick a{
	display: flex;
	align-items: center;
}
.main-container .main-left .sect-wrap .content-wrap .w-nick a img{
	margin-right: 10px;
}
.main-container .main-left .sect-wrap .content-wrap .w-itd {width: 65%; min-width: 0;}
.main-container .main-left .sect-wrap .content-wrap .w-heart {width: 10%; text-align: center;}

.main-container .main-left .sect-wrap .content-wrap .w-itd.resp-box p:nth-of-type(1) {padding-bottom: 5px; font-weight: 500;}
.main-container .main-left .sect-wrap .content-wrap .w-itd.resp-box p:nth-of-type(2) {color: #858894; font-size: 12px;}

.main-container .main-left .sect-wrap .content-wrap ul {width: 100%; /* height: 1397px; */ overflow: auto;}
.main-container .main-left .sect-wrap .content-wrap ul::-webkit-scrollbar {width: 5px;}
.main-container .main-left .sect-wrap .content-wrap ul::-webkit-scrollbar-thumb {border-radius: 50px; background-color: #e7e6e6;}

.main-container .main-left .sect-wrap .content-wrap ul li {box-sizing: border-box;}
.main-container .main-left .sect-wrap .content-wrap ul .head-box {display: flex; padding: 12px 30px; width: 100%; border-bottom: 1px solid #E7E6E6; font-size: 15px; font-weight: 600; text-align: center;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box {display: flex; align-items: center; padding: 10px 30px; border-bottom: 1px solid #E7E6E6;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box:nth-of-type(odd) {background-color: #F5F6FA;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box .rank-box {font-size: 16px; font-weight: 600;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box .nick-box img {width: 36px; height: 36px; margin-right: 5px; border-radius: 8px; font-weight: 500;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box .itd-box {min-width: 0; box-sizing: border-box; white-space: nowrap; font-size: 16px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; padding-left: 7px;}
.main-container .main-left .sect-wrap .content-wrap ul .list-box .heart-box {display: flex; align-items: center; justify-content: center; gap: 0 2%; font-weight: 500;}


@media all and (max-width: 1280px) {
	.main-container .main-left .sect-wrap .content-wrap {border: 0;}
	.main-container .main-left .sect-wrap .content-wrap ul .list-box {padding: 10px 0; border-bottom: 0}

}

@media all and (max-width: 910px) {
	.main-container .main-left .sect-wrap .top-wrap .myrank-box {justify-content: space-between; gap: 15px 10px;}
	.main-container .main-left .sect-wrap .top-wrap .myrank-box .box1 {width: auto;}
	.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area {justify-content: center; gap: 15px 10px; width: auto;}
	.main-container .main-left .sect-wrap .top-wrap .myrank-box .myrank-area .txt-box {flex-direction: column; gap: 10px 0;}

	.main-container .main-left .sect-wrap .content-wrap .w-heart {width: 15%;}
}


@media all and (max-width: 570px) {
	.main-container .main-left .sect-wrap .content-wrap .w-rank {width: 9%;}
	.main-container .main-left .sect-wrap .content-wrap .w-itd {width: 55%;}
	.main-container .main-left .sect-wrap .top-wrap .myrank-box {flex-direction: column; padding: 16px;}
	.main-container .main-left .sect-wrap .content-wrap .w-heart {width: 27%;}
	.main-container .main-left .sect-wrap .content-wrap .w-nick {width: 20%;}
	.main-container .main-left .sect-wrap .content-wrap ul .list-box .itd-box {padding-left: 0;}
}