.fancybox__container {
  display: flex;
  flex-direction: row;
      justify-content: space-between;
}

.fancybox__slide {
  padding-top: 8px;
  padding-bottom: 8px;
}

.fancybox__bannerCol {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20vw;
  min-height: 1px;
  height: 100%;
  background: #f1f1f1;
  padding: 10px;
  
  animation-name: slideInLeft;  
    animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; 
}

.fancybox__bannerCol a {
  display: block;
  text-align: center;
}

.fancybox__bannerCol a img {
  max-width: 100%;
  display: block;
}

.fancybox__leftCol {
  width: 60vw;
  min-height: 1px;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  
   
}

.fancybox__rightCol {
  width: 20vw;
  height: 100%;
  padding: 2rem;
  overflow: auto;
  display: flex;
  align-items: center;
  border-left: 1px solid #edeef0;
  opacity: var(--fancybox-opacity, 1);
  background: #f1f1f1;
  color: #000; 
   animation-name: slideInRight;  
    animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;    
}

 
@keyframes slideInRight {
  0% {
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
      visibility: visible;
      opacity: .1
  }
  100% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
      opacity: 1
  }
} 
@keyframes slideInLeft {
  0% {
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
      visibility: visible;
      opacity: .1
  }
  100% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
      opacity: 1
  }
} 

.fancybox__rightCol.close{
    animation-name: closeInRight;  
    animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;   
}
@keyframes closeInRight {
  0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
      visibility: visible;
      
  }  
  100% {
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
       opacity: .3 
  }
} 
.fancybox__bannerCol.close{
    animation-name: closeInLeft;  
    animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;   
}
@keyframes closeInLeft {
  0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
      visibility: visible;
      opacity: 1
  }
  100% {
      -webkit-transform: translateX(-100%);
      transform: translateX(-100%);
      opacity: .1
  }
} 

.fancybox__rightCol-inner {
  min-width: 100%;
  box-sizing: border-box;
  text-align: center
}
.fancybox__rightCol-inner .callbtn{
    margin: 40px auto 0;
    padding-top: 5px;
    max-width: 220px;
}
.fancybox__rightCol-h {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 15px; 
}
.fancybox__rightCol-thumb { 
  margin-bottom: 30px; 
  min-height: 200px
}
.fancybox__rightCol-thumb img {
  max-width: 100%; 
   
}
 
.fancybox__rightCol-price {
  margin-bottom: 10px; 
  font-size: 22px;
  text-align: center;
}
.fancybox__rightCol-price>span{
	font-weight: 500;
}
.fancybox__rightCol-link {
  margin-bottom: 20px;
}

 
.fancybox__rightCol-link{ 
  padding: 1rem
}
.fancybox__rightCol-link a{
	width: 100%
}

.fancybox__rightCol .button{
	padding: 0px 10px;
    border-radius: 22px; 
    font-size: 15px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 57px;
    min-width: 40%;
    justify-content: center;
	border: 1.5px solid #fff;
	color: #fff;
}
  
.fancybox__rightCol .button.wa_form{
	background: var(--button-color);
	border-color: var(--button-color);
}
.fancybox__rightCol .button.wa_form>span{
	color: #fff
}
.fancybox__rightCol .button.wa_form:hover {
    background: var(--button-color); 
}

.fancybox__rightCol-tel {
  margin-bottom: 10px;
}
.fancybox__rightCol-shedule {
  margin-bottom: 10px;
}
.fancybox__rightCol-address {
  margin-bottom: 10px;
}

.fancybox__rightCol b {
  font-weight: 500;
}

@media screen and (max-width: 1024px) {
.fancybox__bannerCol {
  display: none;
}
.fancybox__leftCol {
  width: 70vw;
}
.fancybox__rightCol {
  width: 30vw;
}
}
@media screen and (max-width: 767px) {
  .fancybox__container {
    flex-direction: initial;
    flex-wrap: wrap;
    overflow-y: auto;
  }
  .fancybox__leftCol {
    width: 100vw;
    height: auto;
  }
  .fancybox__rightCol {
    width: 100vw;
    height: auto;
  }
}