/**/.sa3c {
--sa3c-h: 473px;
--sa3c-cols: 1;
--sa3c-gap: 0px;
--sa3c-accent: #d5a619;
--sa3c-ratio: 1 / 1;
position: relative;
width: 100%;
max-width: 100%;
box-sizing: border-box;
}
.sa3c *,
.sa3c *::before,
.sa3c *::after {
box-sizing: border-box;
} .sa3c .sa3c-swiper {
position: relative;
display: block;
width: 100%;
height: var(--sa3c-h);
margin: 0;
padding: 0;
overflow: hidden;
list-style: none;
z-index: 1;
}
.sa3c .sa3c-swiper > .swiper-wrapper {
position: relative;
display: flex;
width: 100%;
height: 100%;
max-height: none;
margin: 0;
padding: 0;
z-index: 1;
transition-property: transform;
transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
transform: translate3d(0, 0, 0);
box-sizing: content-box;
}
.sa3c .sa3c-swiper .sa3c-slide {
position: relative;
display: block;
flex-shrink: 0; width: calc(100% / var(--sa3c-cols));
height: 100%;
max-height: none;
margin: 0;
padding: 0;
transition-property: transform;
}
.sa3c .sa3c-swiper.swiper-horizontal {
touch-action: pan-y;
}
.sa3c .swiper-backface-hidden .sa3c-slide {
transform: translateZ(0);
backface-visibility: hidden;
}
.sa3c .swiper-slide-invisible-blank {
visibility: hidden;
} .sa3c--ratio .sa3c-swiper {
height: auto;
}
.sa3c--ratio .sa3c-swiper .sa3c-slide {
height: auto;
aspect-ratio: var(--sa3c-ratio);
} .sa3c .sa3c-item {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
background-color: #cbcbcb;
}
.sa3c .sa3c-item .sa3c-img {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0;
border: 0;
border-radius: 0;
box-shadow: none;
object-fit: cover;
object-position: center center;
transform: scale(1.1);
transition: transform 1s cubic-bezier(0.24, 0.74, 0.58, 1);
}
.sa3c--zoom .sa3c-item:hover .sa3c-img {
transform: scale(1);
} .sa3c .sa3c-overlay {
display: none;
}
.sa3c--overlay .sa3c-overlay {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
pointer-events: none;
background-color: rgba(0, 0, 0, 0.5);
opacity: 0;
transform: scale(0.5);
transition: all 0.3s ease;
}
.sa3c--overlay .sa3c-item:hover .sa3c-overlay {
opacity: 1;
transform: scale(1);
} .sa3c .sa3c-link {
position: absolute;
top: 0;
left: 0;
z-index: 2;
display: block;
width: 100%;
height: 100%;
opacity: 0;
cursor: pointer;
text-decoration: none;
outline: none;
box-shadow: none;
transition: opacity 0.3s ease 0.2s;
}
.sa3c .sa3c-link::before,
.sa3c .sa3c-link::after {
content: "";
position: absolute;
background-color: #fff;
transform: scale(0);
transition: transform 0.3s ease 0.2s;
}
.sa3c .sa3c-link::before {
width: 27px;
height: 1px;
top: calc(50% - 1px);
left: calc(50% - 14px);
}
.sa3c .sa3c-link::after {
width: 1px;
height: 27px;
top: calc(50% - 14px);
left: calc(50% - 1px);
}
.sa3c .sa3c-item:hover .sa3c-link,
.sa3c .sa3c-link:focus-visible {
opacity: 1;
}
.sa3c .sa3c-item:hover .sa3c-link::before,
.sa3c .sa3c-item:hover .sa3c-link::after,
.sa3c .sa3c-link:focus-visible::before,
.sa3c .sa3c-link:focus-visible::after {
transform: scale(1);
}
.sa3c .sa3c-link:focus-visible {
outline: 2px solid #fff;
outline-offset: -6px;
} .sa3c .sa3c-swiper button.sa3c-arrow {
position: absolute;
top: 50%;
z-index: 5;
display: flex;
align-items: center;
justify-content: center;
width: 63px;
height: 63px;
min-width: 0;
min-height: 0;
margin: 0;
padding: 0;
border: 1px solid #fff;
border-radius: 50%;
background: transparent;
color: #fff;
line-height: 1;
font-size: 0;
letter-spacing: 0;
text-transform: none;
box-shadow: none;
cursor: pointer;
opacity: 0;
-webkit-appearance: none;
appearance: none;
transition: all 0.3s linear 0s;
}
.sa3c .sa3c-swiper button.sa3c-prev {
left: 50px;
transform: translate(50px, -50%);
}
.sa3c .sa3c-swiper button.sa3c-next {
right: 50px;
transform: translate(-50px, -50%);
}
.sa3c:hover .sa3c-swiper button.sa3c-arrow,
.sa3c .sa3c-swiper button.sa3c-arrow:focus-visible,
.sa3c--arrows-always .sa3c-swiper button.sa3c-arrow {
opacity: 1;
transform: translate(0, -50%);
}
.sa3c .sa3c-swiper button.sa3c-arrow:hover,
.sa3c .sa3c-swiper button.sa3c-arrow:focus-visible {
color: var(--sa3c-accent);
background-color: rgba(255, 255, 255, 0.8);
border-color: rgba(255, 255, 255, 0.2);
outline: none;
}
.sa3c .sa3c-arrow svg {
display: block;
width: 26px;
height: 26px;
fill: none;
stroke: currentColor;
stroke-width: 1.2;
stroke-linecap: round;
stroke-linejoin: round;
pointer-events: none;
}
.sa3c .sa3c-swiper.swiper-navigation-disabled .sa3c-arrow,
.sa3c .sa3c-arrow.swiper-button-lock {
display: none;
} @media (hover: none) {
.sa3c .sa3c-swiper button.sa3c-arrow {
opacity: 1;
transform: translate(0, -50%);
}
.sa3c .sa3c-swiper button.sa3c-prev {
left: 20px;
}
.sa3c .sa3c-swiper button.sa3c-next {
right: 20px;
}
}  html.sa3c-noscroll,
html.sa3c-noscroll body {
overflow: hidden !important;
}
.sa3c-lb {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 2147483000;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.92);
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
-webkit-user-select: none;
user-select: none;
touch-action: pan-y pinch-zoom;
}
.sa3c-lb.is-open {
opacity: 1;
visibility: visible;
}
.sa3c-lb__figure {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
margin: 0;
padding: 60px 80px;
box-sizing: border-box;
}
.sa3c-lb__img {
display: block;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
opacity: 1;
transition: opacity 0.25s ease;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}
.sa3c-lb__img.is-loading {
opacity: 0;
}
.sa3c-lb button.sa3c-lb__btn {
position: absolute;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
min-width: 0;
margin: 0;
padding: 0;
border: 0;
border-radius: 50%;
background: transparent;
color: #fff;
box-shadow: none;
cursor: pointer;
opacity: 0.8;
-webkit-appearance: none;
appearance: none;
transition: opacity 0.2s ease, background-color 0.2s ease;
}
.sa3c-lb button.sa3c-lb__btn:hover,
.sa3c-lb button.sa3c-lb__btn:focus-visible {
opacity: 1;
background-color: rgba(255, 255, 255, 0.12);
outline: none;
}
.sa3c-lb__btn svg {
width: 28px;
height: 28px;
fill: none;
stroke: currentColor;
stroke-width: 1.4;
stroke-linecap: round;
stroke-linejoin: round;
pointer-events: none;
}
.sa3c-lb button.sa3c-lb__close {
top: 12px;
right: 12px;
}
.sa3c-lb button.sa3c-lb__prev {
top: 50%;
left: 12px;
transform: translateY(-50%);
}
.sa3c-lb button.sa3c-lb__next {
top: 50%;
right: 12px;
transform: translateY(-50%);
}
.sa3c-lb__counter {
position: absolute;
bottom: 18px;
left: 50%;
transform: translateX(-50%);
color: rgba(255, 255, 255, 0.8);
font-size: 13px;
line-height: 1;
letter-spacing: 0.08em;
}
.sa3c-lb.is-single .sa3c-lb__prev,
.sa3c-lb.is-single .sa3c-lb__next,
.sa3c-lb.is-single .sa3c-lb__counter {
display: none;
}
@media (max-width: 767px) {
.sa3c-lb__figure {
padding: 60px 0;
}
.sa3c-lb button.sa3c-lb__prev,
.sa3c-lb button.sa3c-lb__next {
top: auto;
bottom: 4px;
transform: none;
}
}
@media (prefers-reduced-motion: reduce) {
.sa3c .sa3c-img,
.sa3c .sa3c-overlay,
.sa3c .sa3c-arrow,
.sa3c-lb,
.sa3c-lb__img {
transition: none !important;
}
} .sa3c-lg .lg-outer .lg-components {
transform: none !important;
opacity: 1 !important;
}
.sa3c-lg .lg-outer .lg-sub-html,
.sa3c-lg .lg-outer.lg-components-open:not(.lg-zoomed) .lg-sub-html {
opacity: 1 !important;
background: rgba(0, 0, 0, 0.45) !important;
color: #eee;
font-size: 16px;
line-height: 19px;
min-height: 39px;
padding: 10px 80px 10px 40px;
transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1) !important;
}
.sa3c-lg .lg-outer.lg-components-open .lg-sub-html {
transform: translate3d(0, -100px, 0);
}
.sa3c-lg .lg-outer .lg-thumb-outer {
position: absolute;
left: 0;
bottom: 0;
height: 100px;
background-color: #0d0a0a;
transform: translate3d(0, 100%, 0);
transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1) !important;
}
.sa3c-lg .lg-outer.lg-components-open .lg-thumb-outer {
transform: translate3d(0, 0, 0);
}
.sa3c-lg .lg-outer .lg-thumb-item {
border-radius: 0 !important;
border: 2px solid #444 !important;
opacity: 1;
transition: border-color 0.25s ease;
}
.sa3c-lg .lg-outer .lg-thumb-item:hover {
border-color: #999 !important;
}
.sa3c-lg .lg-outer .lg-thumb-item.active {
border-color: #fff !important;
}
.sa3c-lg .lg-outer .lg-thumb-item img {
border-radius: 0 !important;
}
.sa3c-lg .lg-outer .lg-toggle-thumb {
position: absolute;
right: 20px;
bottom: 0;
width: 50px;
height: 39px;
padding: 5px 0;
line-height: 29px;
font-size: 24px;
text-align: center;
background-color: #0d0a0a;
border: 0;
border-radius: 2px 2px 0 0;
color: #999;
cursor: pointer;
z-index: 1;
transform: translate3d(0, 0, 0);
transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1), color 0.2s linear !important;
}
.sa3c-lg .lg-outer .lg-toggle-thumb:hover {
color: #fff;
}
.sa3c-lg .lg-outer.lg-components-open .lg-toggle-thumb {
transform: translate3d(0, -100px, 0);
}
@media (max-width: 767px) {
.sa3c-lg .lg-outer .lg-actions .lg-prev,
.sa3c-lg .lg-outer .lg-actions .lg-next {
background: rgba(0, 0, 0, 0.35);
color: #fff;
padding: 8px 10px;
}
}
.sa3c-lg .lg-outer,
.sa3c-lb {
overscroll-behavior: contain; }
.sa3c-lg-host {
display: none !important;
}