#loading{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999;background:rgba(0,0,0,0.7);}
#loading svg{position:absolute;top:50%;left:50%;width:50% !important;height:50% !important;
transform:translate(-50%,-50%) !important;-webkit-transform:translate(-50%,-50%) !important;-moz-transform:translate(-50%,-50%) !important;-o-transform:translate(-50%,-50%) !important;}
#loading path{fill:rgb(157,235,149) !important;}
#loading span{display:block;position:absolute;top:65%;left:50%;font-size:40px;line-height:40px;font-weight:500;letter-spacing:-1.5px;color:#9dec96;
transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);}
.mobile{display:none !important;}
.pc{display:block !important;}


/* 랭킹 */
.subcontainer .topBanner.ranking{height: 327px;background: url(../images-v4/ranking_banner.png) no-repeat 50% 30%;background-size: cover; padding: 0 20px; box-sizing: border-box;}
.subcontainer .topBanner.ranking h2{padding: 199px 0 0;font-size: 40px;line-height: 48px;font-weight: 900;letter-spacing: 0;color: #322D4F;}
.subcontainer .topBanner.ranking h2 span{display: inline-block;width: 40px;height: 35px;background: url(https://cleanbell.blob.core.windows.net/images-v4/icon_crown.png) no-repeat;background-size: 40px;vertical-align: baseline;}

.realRanking{background: #F7F7F7; min-height: 100vh;}
.realRanking .inner{padding: 0 0 43px;}
.realRanking h3{padding: 30px 0;font-size: 24px;line-height: 36px;font-weight: 500;letter-spacing: -1.2px;color: #6131CE;text-align: center;}
.realRanking h3 span{display: inline-block;font-size: 26px;line-height: 36px;font-weight: 600;letter-spacing: 0px;color: #6131CE;}
.realRanking ul{display: block;width: 100%;font-size: 0;}
.rankBox{position: relative;padding-left: 80px;margin-bottom: 17px;cursor: pointer;}
.rankBox:hover dl{border-color: #6131CE;}
.rankBox::before{position: absolute;left: 0;top: 50%;transform: translate(0,-50%);-webkit-transform: translate(0,-50%);-moz-transform: translate(0,-50%);width: 50px;height: 50px;font-size:25px;line-height: 50px;font-weight: 700;letter-spacing: -1.8px;color: #FFF;text-align: center;content: '';z-index: 1;}
.rankBox.rank1::before{background: url(../images-v4/icon_crown_1st.png) no-repeat;background-size: 50px;}
.rankBox.rank2::before{background: url(../images-v4/icon_crown_2nd.png) no-repeat;background-size: 50px;}
.rankBox.rank3::before{background: url(../images-v4/icon_crown_3rd.png) no-repeat;background-size: 50px;}
.rankBox.ranknum::before{background: #322D4F;border: 0;border-radius: 50%;content: attr(href)} 
.rankBox dl{width: 100%;height: 160px;border: 1px solid #E3E3E3;border-radius: 2px;background: #FFFFFF;box-sizing: border-box;}
.rankBox dt{position: relative;display: inline-block;width: 158px;height: 158px;overflow: hidden;}
.rankBox dt img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);width: 100%;}
.rankBox dd{display: inline-block;padding: 20px 30px;height: 118px; vertical-align: top;}
.rankBox dd h4{font-size: 36px;line-height: 54px;font-weight: 500;letter-spacing: -1.8px;color: #363636;}
.rankBox dd ol{margin: 3px 0 5px;display: block;font-size: 0;}
.rankBox dd ol li{display: inline-block;margin-right: 24px;font-size: 18px;line-height: 27px;font-weight: 400;letter-spacing: -0.9px;color: #ACACAC;}
.rankBox dd ol li span{display: inline-block;margin-left: 8px;font-size: 18px;line-height: 27px;font-weight: 700;letter-spacing: 0;color: #6131CE;}
.rankBox dd ol li.star span{padding-left: 24px;margin-left: 0;background: url(https://cleanbell.blob.core.windows.net/images-v4/star24.png) no-repeat left center;}
.rankBox dd small{display: block;font-size: 18px;line-height: 27px;font-weight: 400;letter-spacing: -0.9px;color: #7C7C7C;}
.rankBox dd small span{display: inline-block;margin-left: 8px;font-size: 18px;line-height: 27px;font-weight: 500;letter-spacing: -0.9px;color: #6131CE;}