

/* Start:/local/components/pimunn/materials/templates/science/style.css?17879983954440*/
.science_cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 40px;
  align-items: start;
}

@media screen and (max-width: 768px) {
  .science_cards {
    grid-template-columns: 100%;
  }
}

@media screen and (max-width: 1300px) {

  .science_card,
  .science_card > a {
    grid-template-columns: 40px 1fr 40px;
  }

  .science_card::before {
    right: calc(100% - 63px);
  }
}

.science_card img {
  width: 100%;
}

.science_card .science_card_info {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.science_card .science_card_info p {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: .9333333333rem;
  line-height: 1.57143;
  color: #706f6f;
}

.science_card .science_card_info h4 {
  font-family: "Igra Sans", sans-serif;
  font-weight: 400;
  font-size: 1.0666666667rem;
  line-height: 1.375;
  color: #000;
}

.science_card .arrow_top_right,
.science_card .card_toggle {
  width: 39px;
  height: 39px;
  border: none;
  background: center no-repeat #fff;
  outline: 0;
  cursor: pointer;
  padding: 0;
  border-radius: 50%;
  transition-delay: 0.1s;
  margin-bottom: auto;
}

.science_card .card_toggle {
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.5 0.114868C9.07888 0.114868 9.54815 0.584137 9.54815 1.16301V7.45186H15.837C16.4159 7.45186 16.8851 7.92113 16.8851 8.5C16.8851 9.07888 16.4159 9.54815 15.837 9.54815H9.54815V15.837C9.54815 16.4159 9.07888 16.8851 8.5 16.8851C7.92113 16.8851 7.45186 16.4159 7.45186 15.837V9.54815H1.16301C0.584137 9.54815 0.114868 9.07888 0.114868 8.5C0.114868 7.92113 0.584137 7.45186 1.16301 7.45186H7.45186V1.16301C7.45186 0.584137 7.92113 0.114868 8.5 0.114868Z' fill='%239D1A1C' /%3E%3C/svg%3E");
  background-size: 17px;
  transition: transform 0.3s ease;
}

.science_card .arrow_top_right {
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.344595 13.6554C0.804055 14.1149 1.54899 14.1149 2.00845 13.6554L11.647 4.0169L11.647 12.8235C11.647 13.4733 12.1737 14 12.8235 14C13.4733 14 14 13.4733 14 12.8235L14 1.17652C14 0.526749 13.4733 0 12.8235 0L1.17652 7.62939e-06C0.526747 6.67572e-06 0 0.526755 0 1.17653C0 1.8263 0.526746 2.35305 1.17652 2.35305L9.98311 2.35304L0.344595 11.9916C-0.114864 12.451 -0.114864 13.1959 0.344595 13.6554Z' fill='%239D1A1C' /%3E%3C/svg%3E");
  background-size: 14px;
}

.science_card .card_body {
  grid-column: 1/-1;
  display: none;
  cursor: default;
}

.science_card .card_body ul {
  padding: 36px 11px 18px;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  list-style: none;
  margin: 0;
}

.science_card .card_body ul a {
  color: #000;
  font-size: .9333333333rem;
}

.science_card .card_body ul a:hover {
  color: var(--color-primary);
}

.science_card .card_body .science_album {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.science_card,
.science_card > a {
  grid-template-columns: 65px 1fr 40px;
  gap: 0 13px;
  display: grid;
}

.science_card {
  border: 1px solid #d9d9d9;
  border-radius: 24px;
  padding: 16px;
  align-items: center;
  background-color: #f9f9f9;
  position: relative;
  z-index: 1;
  overflow: hidden;
  cursor: pointer;
}

.science_card.opened::before,
.science_card:hover::before {
  right: -20%;
}

.science_card.opened .arrow_top_right,
.science_card.opened .card_toggle,
.science_card:hover .arrow_top_right,
.science_card:hover .card_toggle {
  background-color: #f9f9f9;
  transition-delay: 0.3s;
}

.science_card.opened .card_toggle {
  transform: rotate(-45deg);
  transition-delay: 0s;
}

.science_card::before {
  content: "";
  display: block;
  position: absolute;
  top: -50%;
  right: calc(100% - 92px);
  width: 140%;
  height: 200%;
  background-color: #fff;
  border-radius: 500px;
  z-index: -1;
  transition: right .3s ease-in;
  pointer-events: none;
  user-select: none;
}

.science_card > a {
  align-items: center;
  grid-column: 1/-1;
  background-size: 0 !important;
}

@media screen and (max-width: 576px) {
  .science_card .card_body .science_album {
    grid-template-columns: 100%;
  }
}

.science_card .card_body .science_album a {
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: center;
}

.science_card .card_body .science_album img {
  max-width: 200px;
}
/* End */
/* /local/components/pimunn/materials/templates/science/style.css?17879983954440 */
