.section{
  position:relative;
  padding:5rem 0;
}

.section-decor{
  position:absolute;
  left:0;
  width:100%;
  pointer-events:none;
}

.section-decor_pos_top{
  top:0;
}

.section-decor__figure{
  height:7.5rem;
  background:linear-gradient(to bottom,rgba(0,0,0,.6),transparent);
}

.media{
  width:100%;
}

.media__list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.875rem;
}

.media__box{
  position:relative;
  overflow:hidden;
  border-radius:0.75rem;
  background:#0e1117;
  box-shadow:0 0.625rem 1.875rem rgba(0,0,0,.6);
}

.box__container{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  height:100%;
}

.box__bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-size:cover;
  background-position:center;
  opacity:.15;
  z-index:1;
}

.box__heading{
  display:flex;
  align-items:center;
  justify-content:center;
  border-bottom:0.0625rem solid rgba(255,255,255,.05);
}

.box__title{
  font-size:1.25rem;
  font-weight:600;
  letter-spacing:0.03125rem;
}

.box__body{
  padding:1.25rem;
  z-index: 4312;
}

.table{
  width:100%;
}

.tableBlock{
  width:100%;
}

.top{
  width:100%;
  display:flex;
  flex-direction:column;
  font-size:0.875rem;
}

.top__rw{
  display:flex;
  align-items:center;
  padding:0.625rem 0.9375rem;
  border-bottom:0.0625rem solid rgba(255,255,255,.05);
}

.top__header{
  font-weight:600;
  background:rgba(255,255,255,.02);
}

.top__num{
  width:3.125rem;
}

.top__icon{
  width:1.875rem;
}

.top__name{
  flex:1;
}

.top__total{
  width:5rem;
  text-align:right;
}

.top__content{
  display:flex;
  align-items:center;
  gap:0.375rem;
}

.top__body{
  overflow:auto;
}

.top__body::-webkit-scrollbar{
  width:0.375rem;
}

.top__body::-webkit-scrollbar-thumb{
  background:#444;
  border-radius:0.375rem;
}

.rating{
  width:100%;
}

.rating__body{
  display:flex;
  flex-direction:column;
  gap:0.625rem;
}

.rating-btns{
  display:flex;
  gap:0.625rem;
  margin-top:0.625rem;
}

.rating-btns__btn{
  flex:1;
  height:2.5rem;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.375rem;
  cursor:pointer;
  border-radius:0.375rem;
  background:#1b1f2a;
  transition:.2s;
  font-size:0.875rem;
}

.rating-btns__btn:hover{
  background:#2a3140;
}

.rating-btns__btn[data-open-tab-active="true"]{
  background:#3a4457;
}

.social-list{
  display:flex;
  flex-direction:column;
  gap:0.9375rem;
}

.social{
  position:relative;
}

.social__link{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:5;
}

.social__container{
  position:relative;
  height:5.625rem;
  display:flex;
  align-items:center;
  padding:0 1.25rem;
  border-radius:0.625rem;
  background-size:cover;
  background-position:center;
  overflow:hidden;
  transition:.25s;
}

.social__container::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,.55);
}

.social__ico{
  position:relative;
  width:2.5rem;
  height:2.5rem;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  margin-right:0.75rem;
  z-index:2;
}

.social__title{
  position:relative;
  z-index:2;
  font-size:1rem;
  font-weight:500;
}
.social__container{
  display:flex;
  align-items:center;
}

.social__arrow{
  margin-left:auto;
  z-index:2;
  transition:.25s;
}

.social:hover .social__arrow{
  transform:translateX(0.625rem);
}

.social__container:hover{
  transform:translateY(-0.1875rem);
}

.fadeIn{
  animation:fadeIn .8s ease both;
}

@keyframes fadeIn{
  0%{opacity:0;transform:translateY(1.25rem)}
  100%{opacity:1;transform:translateY(0)}
}

@media(max-width:1100px){
  .media__list{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:700px){
  .media__list{
    grid-template-columns:1fr;
  }
}
/*ice*/

.media__box{
  border:0.0625rem solid rgba(120,200,255,.25);
  background:linear-gradient(180deg,rgba(10,25,45,.85),rgba(5,12,20,.95));
  backdrop-filter:blur(0.375rem);
  box-shadow:
          0 0 1.5625rem rgba(0,140,255,.15),
          inset 0 0 1.25rem rgba(120,200,255,.05);
}

.media__box::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:0.75rem;
  pointer-events:none;

  opacity:.35;
}


.box__heading{
  background:linear-gradient(180deg,rgba(20,60,100,.25),rgba(0,0,0,0));
  border-bottom:0.0625rem solid rgba(120,200,255,.2);
}

.box__title{
  color:#ccefff;
  letter-spacing:.08em;
}

.top__rw{
  transition:.25s;
}

.top__rw:hover{
  background:linear-gradient(90deg,rgba(120,200,255,.12),transparent);
  box-shadow:inset 0 0 0.625rem rgba(120,200,255,.2);
}

.rating-btns__btn{
  border:0.0625rem solid rgba(120,200,255,.2);
  background:linear-gradient(180deg,#0b1f35,#081420);
  box-shadow:inset 0 0 0.5rem rgba(120,200,255,.08);
}

.rating-btns__btn:hover{
  box-shadow:
          0 0 0.625rem rgba(120,200,255,.4),
          inset 0 0 0.625rem rgba(120,200,255,.25);
  background:linear-gradient(180deg,#133a5e,#0b2036);
}

.rating-btns__btn[data-open-tab-active="true"]{
  background:linear-gradient(180deg,#1a4a6b,#0d2c44);
  box-shadow:
          0 0 0.75rem rgba(120,220,255,.7),
          inset 0 0 0.625rem rgba(120,220,255,.5);
  color:#fff;
}

.social__container{
  border:0.0625rem solid rgba(120,200,255,.2);
  box-shadow:
          0 0 0.9375rem rgba(0,150,255,.15),
          inset 0 0 0.75rem rgba(120,200,255,.1);
}

.social__container:hover{
  box-shadow:
          0 0 1.25rem rgba(120,220,255,.4),
          inset 0 0 1.25rem rgba(120,220,255,.25);
}

.social__title{
  color:#d9f6ff;
  text-shadow:0 0 0.375rem rgba(120,200,255,.7);
}