.ranking {color: #13192E;}
.ranking h1 {margin: 13px 0 12px; font-size: 28px; line-height: 36px; font-weight: 700;}
.ranking h2 {font-size: 28px; line-height: 30px; font-weight: 700; color: #13192E;}
.ranking p {font-size: 16px; line-height: 24px;}

.ranking_button {margin: 24px 0 0;position: relative;}
.ranking_button a {display: inline-block;background: #FF5500;line-height: 56px;font-size: 16px;font-weight: 700;color: #fff;padding: 0 16px;border-radius: 16px;/* position: relative; */}
.ranking .core {max-width: 1118px;margin: 0 auto;text-align: center;}
.ranking .core .bg_top {background: url(/static/pr/cms/ranking/img/bg_top_gr.svg) no-repeat top center;border-radius: 0 0 24px 24px;margin: 0 16px;/* border: 1px red solid; */}

.ranking .top {padding: 32px 16px; max-width: 580px; margin: 0 auto; color: #fff;}
.ranking .top .text {font-size: 16px; line-height: 24px;}
.ranking .top .logos {}
.ranking .cause {padding: 32px 16px 0;max-width: 867px;margin: 0 auto;}
.ranking .cause .txt {margin:20px 0 0;}
.ranking .cause p {}

.ranking .trio {margin: 32px 16px 0;}
.ranking .trio .wrap {display: flex;gap: 20px;margin: 21px auto 0;}
.ranking .trio .wrap .item {max-width: 348px;border: 1px solid #EAEAF9;text-align: right;border-radius: 24px;width: 33%;}
.ranking .trio .wrap .item .inner {max-width: 233px;margin: 0 0 0 auto;text-align: center;padding: 29px  0 20px;}
.ranking .trio .wrap .item .inner .logo {}
.ranking .trio .wrap .item .inner .name {text-align: center;font-size: 20px;line-height: 24px;margin: 7px 0 0;}
.ranking .trio .wrap .item.winer_1 {background:#F4F4FC url(/static/pr/cms/ranking/img/place_1.svg) no-repeat 14px 0;}
.ranking .trio .wrap .item.winer_2 {background:#F4F4FC url(/static/pr/cms/ranking/img/place_2.svg) no-repeat 17px 0;}
.ranking .trio .wrap .item.winer_3 {background:#F4F4FC url(/static/pr/cms/ranking/img/place_3.svg) no-repeat 25px 0;}

.ranking .rest {margin: 32px 0 0;}
.ranking .rest .more {}
.ranking .rest .companies {display:flex;gap:20px;justify-content: center;flex-wrap: wrap;}
.ranking .rest .companies .item {border: 1px solid #EAEAF9;background: #F4F4FC;border-radius:24px;max-width: 257px;width: 100%;/* display: inline-flex; */padding: 30px 0px 20px;flex-wrap: wrap;}

.ranking .rest .companies .item .logo {background: #C3C3EE; width: 100px; height: 80px; border-radius: 10px;}
.ranking .rest .companies .item .name {font-size:16px;line-height:24px;letter-spacing: 0.15px;color:#000;margin: 4px 0 0;}
.ranking .rest .companies .item {background-position:center 0; background-repeat:no-repeat;}
.ranking .rest .companies .item.com_4 {background-image: url(/static/pr/cms/ranking/img/place_4.svg);}
.ranking .rest .companies .item.com_5 {background-image: url(/static/pr/cms/ranking/img/place_5.svg);}
.ranking .rest .companies .item.com_6 {background-image: url(/static/pr/cms/ranking/img/place_6.svg);}
.ranking .rest .companies .item.com_7 {background-image: url(/static/pr/cms/ranking/img/place_7.svg);}
.ranking .rest .companies .item.com_8 {background-image: url(/static/pr/cms/ranking/img/place_8.svg);}
.ranking .rest .companies .item.com_9 {background-image: url(/static/pr/cms/ranking/img/place_9.svg);}
.ranking .rest .companies .item.com_10 {background-image: url(/static/pr/cms/ranking/img/place_10.svg);}



.ranking .collection {
    border-radius: 32px;
    background: #EAEAF9;
    padding: 32px 0;
    margin: 30px 0;
    overflow: hidden;
}
.ranking .collection .bookshelf {
    display: flex;
    gap: 24px;
    margin: 32px 16px 0;
    overflow-x: scroll;
    justify-content: flex-start;
}
.ranking .collection .bookshelf .item {
    /* max-width: fit-content; */
    text-align: left;
    /* border: 1px red solid; */
    width: min-content;
    padding: 0 0 20px;
}
.ranking .collection .bookshelf .item .cover {
    padding: 20px 0 0;
    position: relative;
}
.ranking .collection .bookshelf .item .cover .stiker {
    font-size: 12px;
    line-height: 18px;
    color: #fff;
    padding: 1px 6px 12px;
    position: absolute;
    left: 0;
    z-index: 1;
    /* width: 200px; */
    top: 0;
    border-radius: 4px 4px 0 0;
}
.ranking .collection .bookshelf .item .cover .stiker.hit {
    background: #FF5500;
}
.ranking .collection .bookshelf .item .cover .stiker.new {
    background: #0A1E78;
}
.ranking .collection .bookshelf .item .cover img {box-shadow: 0 8px 16px rgba(0, 0, 0, .08), 0 0 2px 0 rgba(0, 0, 0, .16);border-radius: 12px;height: 220px;display: block;z-index: 1;position: relative;}
.ranking .collection .bookshelf .item .name {
    /* max-width: max-content; */
    /* width: 100%; */
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    color: #13192E;
    margin: 11px 0 0;
    /* border: 1px red solid; */
    /* width: min-content; */
}
.ranking .collection .bookshelf .item .author {
    color: #5A617C;
    font-size: 16px;
    margin: 3px 0 0;
    line-height: 20px;
}

.ranking .info {background: #3135BA;border-radius:24px;padding: 24px 16px;margin: 0 16px;}
.ranking .info h2 {color:#fff;}
.ranking .info .triplet {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-areas:
		"A A"
		"B C";
	gap: 24px;
	margin: 24px 0;
}
.ranking .info .triplet .cell {border-radius:24px;background:#fff;padding: 24px 18px;text-align: left;}
.ranking .info .triplet .cell.c_1 {grid-area: A;}
.ranking .info .triplet .cell.c_2 {grid-area: B;}
.ranking .info .triplet .cell.c_3 {grid-area: C;}

.ranking .info .triplet .cell h5{font-size:16px;line-height:24px;font-weight: 700;}
.ranking .info .triplet .cell p{margin: 15px 0 0;max-width: 912px;}
.ranking .info .pointer {
    position: absolute;
    top: -53px;
    /* left: 5px; */
    padding: 0 0 0 9px;
}

@media screen and (max-width:1118px){
	.ranking .core .bg_top {margin:0;}
	
}

@media screen and (max-width:760px){
	.ranking h1 {margin: 13px 0 12px;}
	.ranking h2 {font-size: 24px; }
	
	.ranking .core .bg_top {background: linear-gradient(180deg, #3135BA 0%, #4C52DC 100%);}
	.ranking .trio {margin: 32px 16px 0;}
	.ranking .trio .wrap {display: flex;gap: 20px;margin: 21px auto 0;flex-direction: column;align-items: center;}
	.ranking .trio .wrap .item {max-width: 348px;width: 100%;}
	.ranking .trio .wrap .item .inner {max-width: 233px;margin: 0 0 0 auto; padding: 29px  0 20px;}
}

@media screen and (max-width:640px){
	.ranking .info {background: #3135BA;border-radius:0 0 24px 24px;padding: 24px 16px;margin: 0 0px;}
	.ranking .info .triplet {display: flex;flex-direction: column; margin: 24px 0;}
	.ranking .info .pointer {
    display: none;
}
}

@media screen and (max-width: 640px){
	.ranking_button a {display: block;}
}




/* hiding styles */
.more {display:none;}
.showMoreButton {display: inline-block;background: #6262D9;line-height: 56px;font-size: 16px;font-weight: 700;color: #fff;width:288px;text-align:center;border-radius: 16px;border: 0;margin: 20px 0 0;}
@media screen and (max-width: 640px){
	
.more {display:block;}
.visibleToggle {display:none;}
.hideItem {display:none;}
.showItem {display: inline-flex;}
}