@charset "UTF-8";


.main-visual {position:relative; overflow:hidden;}
.main-visual .item {height:950px; position: relative; z-index:1;}
.main-visual .item .background {position:absolute;  top:0; left:0; width:100%; height:100%; object-fit:cover; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;  opacity: 1 !important; animation-duration: 3s; transition: all 1s ease;}
.main-visual .content {position:absolute; top:50%; left:0; width:100%; color:var(--white-color);  transform:translateY(-50%); z-index:50;}
.main-visual .content em {font-style: normal; font-weight: 700; font-size:var(--font-size-22); line-height:1.4em; margin-bottom:2px;}
.main-visual .content .tit {font-size:var(--font-size-80); line-height:1.11em; font-weight:700; margin-bottom:20px;}
.main-visual .content p {font-size:var(--font-size-20); line-height:1.6em; opacity:.8; font-weight: 300;}

.main-visual .controler-wrap {position:absolute; bottom:175px; left:0; width:100%; z-index:2; }
.main-visual .controler-wrap .inner {display:flex; align-items:center;}
.main-visual .slide-btns {width:14px;height:21px; font-size:0; line-height:0; border:0; background-color:transparent; background-repeat:no-repeat; background-position:50% 50%; z-index:50}
.main-visual .slide-prev {margin-right:20px;background-image:url('../img/main/slide_prev.png');}
.main-visual .slide-next {margin-left:20px;background-image:url('../img/main/slide_next.png');}
.main-visual .slide-btns:hover {opacity:1;}
.main-visual .slide-btns:focus {outline:0}
.main-visual .controler {margin-right:40px;}
.main-visual .controler {width:75px; height:75px; margin-right:40px; position:relative;}
.main-visual .controler .slick-playback {position:absolute; top:0; left:0; width:75px; height:75px;  text-indent:-9999em; border:0; border-radius:100%;  background-color:transparent; z-index:5}
.main-visual .controler .slick-playback:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:url('/html/_skin/img/main/bt_pause.png') 50% 50% no-repeat;}
.main-visual .controler .slick-playback.play:after {background-image:url('/html/_skin/img/main/bt_play.png')}
.main-visual .controler .slick-playback:focus {outline:0}
.main-visual .controler .slider-progress {position:absolute;}
.main-visual .controler .slider-progress:after {content:""; position:absolute; top:0; left:0; width:75px; height:75px; border:4px solid #fff; border-radius:100%; opacity:.2;}
.main-visual .controler .slick-progress circle {fill: transparent; stroke: #fff;stroke-width: 4; }
.main-visual .controler .slider-play {display:none}
.main-visual .controler .slider-pause,
.main-visual .controler .slider-play {position:relative; width:75px; height:75px;  text-indent:-9999em; border:0; border-radius:100%;  background-repeat:no-repeat; background-position:50% 50%; background-color:transparent; z-index:5}
.main-visual .controler .slider-play:after,
.main-visual .controler .slider-pause:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; border-radius:100%;  border: 4px solid #fff; opacity:.3;}
.main-visual .controler .slider-pause .circle {position:absolute; top:0; left:0; width:100%; height:100%; stroke-dasharray: 500; stroke-dashoffset: 500; transform: rotate(-90deg); animation: ani 9s linear infinite;}
.main-visual .controler .slider-play {background-image:url('../img/main/bt_play.png')}
.main-visual .controler .slider-pause {background-image:url('../img/main/bt_pause.png')}
.main-visual .controler .slider-pause:focus,
.main-visual .controler .slider-play:focus {outline:0}
.main-visual .slick-counter {display:flex; align-items: center; color:#fff; z-index:6;}
.main-visual .slick-counter .current-wrap {font-weight:700;}
.main-visual .slick-counter .bar {padding:0 6px;}

.animated {transition: all .5s ease;}
.main-visual [data-animation-in] {opacity: 0;animation-duration: 1.5s; transition: opacity 0.5s ease 0.3s;transition:1s;}

@keyframes zoomInImage {
  from {
    transform: scale3d(1.1, 1.1, 1.1);
	transition:1s;
  }
  to {
    transform: scale3d(1, 1, 1);
	transition:1s;
  }
}
.zoomInImage {animation-name: zoomInImage;}

@keyframes zoomOutImage {
  from {
    transform: scale3d(1, 1, 1);
	transition:1s;
  }
  to {
    transform: scale3d(1.1, 1.1, 1.1);
	transition:1s;
  }
}
.zoomOutImage {animation-name: zoomOutImage;transition:1s;}


.main-visual .scroll {position:absolute; bottom:80px; right:50px;  z-index:10;}
.main-visual .scroll .circle {position:relative; width:141px; height:141px; background:url('../img/main/scroll.png') 50% 50% no-repeat; background-size:contain; animation: mainRotate 7s infinite linear; border-radius: 100%; display: flex;align-items: center; justify-content: center;}
.main-visual .scroll .down {position:absolute; top:50%; left:50%; width:15px; height:31px; background:url('../img/main/scroll_down.png') 50% 50% no-repeat; background-size:contain;  transform:translate(-50%,-50%); animation: mainDown.9s linear infinite alternate;}

@keyframes mainRotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@keyframes mainDown {
	from {
		top:45%;
	}
	to{
		top:50%;
	}
}


.main-title {margin-bottom:40px; }
.main-title h2 {font-size:var(--font-size-56); line-height:1.4em; color:var(--dark-color); font-weight: 700; margin-bottom: 20px;} 
.main-title .cnt {font-size:18px; line-height:1.6em; color:var(--secondary-color);}

.main-more {margin-bottom: 90px; position: relative; z-index:20;}
.main-more a {display:inline-flex; align-items: center; position: relative; height:50px; color:var(--dark-color); font-size:var(--font-size-14); line-height:1.4em; width:175px; border:1px solid rgba(21,21,21,.70); border-radius: 25px; padding:0 25px; font-family: "Maven Pro", sans-serif;}
.main-more a:after {content:""; position:absolute; top:50%; right: 13px; transform: translateY(-50%); width:26px; height: 26px; border-radius: 100%; background:rgba(21,21,21,.11) url('../img/main/more.png') 50% 50% no-repeat; transition: all 0.3s;}
.main-more a:hover {border-color:var(--dark-color); font-weight: 500;}
.main-more a:hover:after {background-image:url('../img/main/more_w.png'); background-color:var(--dark-color);}

.parellex-title {width:100%; top:0; left:0; height:100vh; display:flex; align-items: center; position: absolute; z-index: 30;}
.parellex-title .inner {position: relative; }
.parellex-title .title {font-size:var(--font-size-200);line-height:1em; font-weight: 700; color:var(--dark-color); position:absolute; top:0; left:0; width:100%; height: 100%; display:flex; align-items: center;}
.parellex-title .title p {position: absolute; top: 50%; transform: translateY(-50%); left: 0; width:100%;} 
.parellex-title .title p.color-dark {color: var(--dark-color); } 
.parellex-title .title p.color-white {color: var(--white-color);}
.parellex-title .title.t1 p {left:42.7%;}
.parellex-title .title.t1 p.color-dark {clip-path: inset(0 0 0 7.6% round 0px);}
.parellex-title .title.t2 p {left:13%;}
.parellex-title .title.t2 p.color-dark {clip-path: inset(0 63% 0 0 round 0px);}
.parellex-title .title.t3 p {left:37%;}
.parellex-title .title.t3 p.color-dark {clip-path: inset(0 0 0 13% round 0px);}
.parellex-title .title.t4 p {left:29%;}
.parellex-title .title.t4 p.color-dark {clip-path: inset(0 79% 0 0 round 0px);}

:lang(ru) .parellex-title .title {font-size:var(--font-size-180)}
:lang(ru).parellex-title .title.t3 {font-size:var(--font-size-120)}

.main-product .board-wrap {display:none;}

.main-product {margin-top:100px;position: relative; overflow:hidden ; }
.product-wrapper {overflow:hidden;}
.main-product .group {display: flex; align-items: center; min-height: 100vh; margin-bottom:100px;}
.main-product .group:last-child {margin-bottom:0;}
.main-product .group .inner {position:relative; display:flex; flex-wrap:wrap; width:100%; max-width:1440px; margin:0 auto;} 
.main-product .group .content {position: relative;  max-width:700px; width:100%; will-change: transform, opacity;}
.main-product .group .thumb-pic {position: relative; display:flex; width:100%; overflow: hidden; z-index: 1;}
.main-product .group .pic {position: relative;  max-width:700px; width:100%; overflow: hidden;}
.main-product .group .pic img {width:100% !important; display: block; transition: .3s; will-change: transform, opacity; position: relative; z-index: 1;}
.main-product .group .pic {position: relative; z-index: 1;}
.main-product .group .pic:hover img {transform: scale(1.1) !important;}
.main-product .group:nth-child(even) .inner {justify-content: flex-end;}
.main-product .group:nth-child(even) .thumb-pic {justify-content: flex-end;}
.main-product .group:nth-child(2) .thumb-pic .title {left:auto; right:50%; transform:translate(28.1%,-50%);}
.main-product .group:nth-child(3) .thumb-pic .title {transform:translate(-22%,-50%);}
.main-product .group:nth-child(4) .thumb-pic .title {left:auto; right:50%; transform:translate(19.5%,-50%);}



.main-news {margin-top:100px;background:url('../img/main/new_bg.jpg') 50% 50% no-repeat; background-size:cover; padding: 230px 0 110px; position: relative; z-index:10;}
.main-news .inner {position: relative;}
.main-news .main-title {margin-bottom:55px;}
.main-news .main-title h2 {font-size:var(--font-size-70); line-height:1.4em; color:var(--white-color);}
.main-news .main-more {position:absolute; top:20px; right:20px;}
.main-news .main-more a {border-color:rgba(255,255,255,.70); color:var(--white-color);}
.main-news .main-more a:after {background-color:rgba(255,255,255,.11); background-image:url('../img/main/more_w.png');}
.main-news .main-more a:hover {border-color:var(--white-color);}
.main-news .main-more a:hover:after {background-color:var(--white-color); background-image:url('../img/main/more.png');}
.main-news .news-slider {position: relative;}
.main-news .news-slider .swiper-container {overflow:visible;}
.main-news .item {width:438px; margin-right: 38px;}
.main-news .item .thumb {position:relative; height:0; padding-bottom:65.5%; overflow:hidden;}
.main-news .item .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.main-news .item .tit {margin-top:20px; color:var(--white-color); opacity:.80; font-size:var(--font-size-22); line-height:1.4em; transition: .3s;}
.main-news .item a:hover .thumb img {transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04);}
.main-news .item a:hover .tit {opacity:1;}
.main-news .swiper-button-prev,
.main-news .swiper-button-next {width:60px; height: 60px; margin-top:-50px; background-color:#fff; opacity:1; z-index:20; background-repeat:no-repeat; background-size:12px 20px; background-position: 50% 50%; transition: .3s;}
.main-news .swiper-button-prev {left:-22px; background-image:url('../img/main/photo_bt_prev.png');}
.main-news .swiper-button-next {right:-22px; background-image:url('../img/main/photo_bt_next.png');}
.main-news .swiper-button-prev:hover,
.main-news .swiper-button-next:hover {background-color:var(--blue-color)}
.main-news .swiper-button-prev:hover {background-image:url('../img/main/photo_bt_prev_hover.png');}
.main-news .swiper-button-next:hover {background-image:url('../img/main/photo_bt_next_hover.png');}
.main-news .swiper-button-prev.swiper-button-disabled,
.main-news .swiper-button-next.swiper-button-disabled {opacity:0.5}

.main-inquiry {background:url('../img/main/inquiry_bg.jpg') 50% 50% no-repeat; background-size:cover; height: 950px; display:flex; align-items: center;}
.main-inquiry .main-title h2 {font-size:var(--font-size-64); color:var(--white-color); }
.main-inquiry .main-title .cnt {color:var(--white-color); opacity:.80;}
.main-inquiry .main-more {margin-bottom:0;}
.main-inquiry .main-more a {border-color:rgba(255,255,255,.70); color:var(--white-color);}
.main-inquiry .main-more a:after {background-color:rgba(255,255,255,.11); background-image:url('../img/main/more_w.png');}
.main-inquiry .main-more a:hover {border-color:var(--white-color);}
.main-inquiry .main-more a:hover:after {background-color:var(--white-color); background-image:url('../img/main/more.png');}


#main .pin-spacer {
	z-index: auto !important;
	pointer-events: none !important;
}




