@charset "UTF-8";
   section.gt-block.reference-card .reference-card__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: clamp(6rem, 8vw, 10rem) 0;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start;
gap: 4rem;
-ms-flex-item-align: stretch;
align-self: stretch;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
section.gt-block.reference-card .reference-card__content {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
section.gt-block.reference-card .reference-card__content .card {
width: calc(50% - 2rem);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: clamp(2rem, 5vw, 5rem);
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 4rem;
border-radius: 0rem 4rem 4rem 4rem;
background: #fff;
-webkit-box-shadow: 0px 4px 30px 0px rgba(0, 75, 137, 0.1);
box-shadow: 0px 4px 30px 0px rgba(0, 75, 137, 0.1);
}
@media screen and (max-width: 900px) {
section.gt-block.reference-card .reference-card__content .card {
width: calc(100% - 0rem);
}
}
@media screen and (max-width: 820px) {
section.gt-block.reference-card .reference-card__content .card {
max-width: 100%;
}
}
@media screen and (max-width: 820px) {
section.gt-block.reference-card .reference-card__content .card {
max-width: 100%;
}
}
section.gt-block.reference-card .reference-card__content .card.hidden {
display: none;
}
section.gt-block.reference-card .reference-card__content .card.col-1 {
min-width: 100%;
}
section.gt-block.reference-card .reference-card__content .card.col-1.hidden {
display: none;
}
section.gt-block.reference-card .reference-card__content .card.col-1 .video {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
section.gt-block.reference-card .reference-card__content .card-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-width: 20rem;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0.5rem;
}
section.gt-block.reference-card .reference-card__content .card-header__user {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 2rem;
}
section.gt-block.reference-card .reference-card__content .card-header__user figure {
width: 100%;
max-width: 15rem;
height: 15rem;
border-radius: 10rem;
aspect-ratio: 1/1;
}
@media screen and (max-width: 500px) {
section.gt-block.reference-card .reference-card__content .card-header__user figure {
max-width: 10rem;
height: 10rem;
}
}
section.gt-block.reference-card .reference-card__content .card-header__user figure img {
width: 100%;
max-width: 15rem;
height: 15rem;
border-radius: 10rem;
-o-object-fit: cover;
object-fit: cover;
aspect-ratio: 150/150;
}
@media screen and (max-width: 500px) {
section.gt-block.reference-card .reference-card__content .card-header__user figure img {
max-width: 10rem;
height: 10rem;
aspect-ratio: 100/100;
}
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 3rem;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .name {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 1rem;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .name h3 {
line-height: 1;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .name .age {
color: #5e6f7e;
font-size: 1.6rem;
font-style: normal;
line-height: 1;
font-family: "Avenir Next LT Pro", sans-serif;
font-weight: 600;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .name .date {
color: #5e6f7e;
font-size: 1.2rem;
font-style: normal;
line-height: 1;
font-family: "Avenir Next LT Pro", sans-serif;
font-weight: 600;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .diagnostic {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 1rem;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .diagnostic-title {
color: #004b89;
font-size: 1.2rem;
font-style: normal;
line-height: 1;
text-transform: uppercase;
font-family: "Avenir Next LT Pro", sans-serif;
font-weight: 600;
}
section.gt-block.reference-card .reference-card__content .card-header__user .detail .diagnostic .desc {
color: #5e6f7e;
font-size: 1.6rem;
font-style: normal;
line-height: 1;
font-family: "Avenir Next LT Pro", sans-serif;
font-weight: 600;
}
section.gt-block.reference-card .reference-card__content .card .description p {
color: #28323c;
font-style: italic; font-size: calc(var(--fs-small-rate) * 2rem);
line-height: 1.4;
font-family: "Inter", sans-serif;
font-weight: 400;
}
section.gt-block.reference-card .reference-card__content .card .video {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0.625rem;
-ms-flex-item-align: stretch;
align-self: stretch;
border-radius: 0rem 0.625rem 0.625rem 0.625rem;
cursor: pointer;
}
@media screen and (max-width: 900px) {
section.gt-block.reference-card .reference-card__content .card .video {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
}
section.gt-block.reference-card .reference-card__content .card .video:hover .video__image {
scale: 1.03;
}
section.gt-block.reference-card .reference-card__content .card .video__image {
position: relative;
width: 100%;
max-width: 48rem;
border-radius: 0rem 0.625rem 0.625rem 0.625rem;
overflow: hidden;
-webkit-transition: 0.3s;
transition: 0.3s;
}
section.gt-block.reference-card .reference-card__content .card .video__image img {
width: 100%;
max-width: 48rem;
border-radius: 0rem 0.625rem 0.625rem 0.625rem;
aspect-ratio: 480/250;
-o-object-fit: cover;
object-fit: cover;
}
section.gt-block.reference-card .reference-card__content .card .video__image .play__button {
position: absolute;
top: 50%;
left: 50%;
width: 20%;
max-width: 80px;
aspect-ratio: 1/1;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 10;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
section.gt-block.reference-card .reference-card__content .card .video__image .play__button img {
width: 100%;
height: auto;
fill: white;
}
section.gt-block.reference-card .reference-card__content .card .video iframe {
width: 100%;
height: 450px;
border: none;
border-radius: 8px;
}
.video-popup {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.8);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
z-index: 10000;
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.video-popup.active {
opacity: 1;
visibility: visible;
}
.video-popup__content {
position: absolute;
max-width: 50%;
width: 90%;
background: #000;
border-radius: 8px;
overflow: hidden;
-webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 768px) {
.video-popup__content {
width: 100%;
max-width: 100%;
}
}
.video-popup__content iframe {
width: 100%;
height: 100%;
border: none;
border-radius: 8px;
}
.video-popup__close {
position: absolute;
top: -10px;
right: -10px;
background: #fff;
color: #000;
border: none;
font-size: 24px;
width: 40px;
height: 40px;
border-radius: 50%;
cursor: pointer;
line-height: 40px;
text-align: center;
-webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
-webkit-transition: -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
transition: -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
transition: transform 0.2s ease, box-shadow 0.2s ease;
transition: transform 0.2s ease, box-shadow 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease;
}
.video-popup__close:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
-webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
} @media (max-width: 768px) {
.video-popup__content iframe {
height: 300px;
}
.video-popup__close {
font-size: 20px;
width: 35px;
height: 35px;
line-height: 35px;
}
}
@media (max-width: 480px) {
.video-popup__content iframe {
height: 200px;
}
}
.show-all-references {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
margin: 0 auto;
padding-bottom: 8rem;
margin-top: -10rem;
position: relative;
z-index: 5;
}
.show-all-references .show-more-text {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 0.5rem;
font-size: calc(var(--fs-rate) * 3rem);
line-height: 1.2;
font-family: "Avenir Next LT Pro", sans-serif;
font-weight: 600;
font-style: normal;
color: #004b89;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.show-all-references .show-more-text .btn__icon svg {
-webkit-transition: 0.3s;
transition: 0.3s;
}
.show-all-references .show-more-text:hover {
color: #1bbbe9;
}
.show-all-references .show-more-text:hover .btn__icon svg {
stroke: #1bbbe9;
}
.reference-card .card {
position: relative;
}
.reference-card .card.fade-out .shadow {
content: "";
position: absolute;
width: -webkit-fill-available;
bottom: -30px;
left: 0;
right: 0;
height: 100%;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.5)), color-stop(65%, rgb(255, 255, 255)));
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgb(255, 255, 255) 65%);
}
.reference-card .card.hidden {
display: none;
}