.nano-swiper-pagination{
    width:210px;
    background-color: #000;
    color:#656565;
    height:40px;
    display:grid;
    grid-template-columns:40px 1fr 40px;
    text-align:center;
    line-height: 40px;
    font-size:11px;
}
.nano-swiper-pagination .current{
    color:#fff
}
.nano-swiper-pagination .nano-slider-prev,
.nano-swiper-pagination .nano-slider-next{
    position: relative;
    cursor: pointer;
}
.nano-swiper-pagination .nano-slider-prev::before,
.nano-swiper-pagination .nano-slider-next::before{
    content:'';
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-image:url('../img/icons/nano-icon-arrow-white.svg');
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: center left;
}
.nano-swiper-pagination .nano-slider-prev::before{
    transform:rotate(180deg)
}

/**/
.swiper.swiper-3-cols{
    width:100%;
    max-width:577px;
    overflow: visible;


}
.swiper.swiper-3-cols .swiper-slide{
    transition:scale ease-in-out .6s, opacity ease-in-out .6s,transform ease-in-out .6s;
    opacity:0;
    font-size:15px;
    text-align:center
}


.swiper.swiper-3-cols .swiper-slide.swiper-slide-active{
    opacity:1
}
.swiper.swiper-3-cols .swiper-slide.swiper-slide-prev{
    scale:0.6;
    transform-origin:top right
}
.swiper.swiper-3-cols .swiper-slide.swiper-slide-next{
    scale:0.6;
    transform-origin:top left
}
.swiper.swiper-3-cols .swiper-slide:not(.swiper-slide-active){
    transform:translateY(140px)
}
.swiper.swiper-3-cols .nano-swiper-pagination{
    position:absolute;
    top:56vw;
    left:calc(50% - 110px);
    z-index:2
}
.swiper.swiper-3-cols.nav-left .nano-swiper-pagination{
    left:calc(50% - 65px);
}
.swiper.swiper-3-cols .swiper-slide .swiper-image+div{
padding:30px
}
.swiper.swiper-3-cols .swiper-slide .swiper-image+div h4+div{
    opacity:1px;
    transition:opacity ease-in-out .6s
}
.swiper.swiper-3-cols .swiper-slide:not(.swiper-slide-active) .swiper-image+div h4+div{
    opacity:0
}
@media(max-width:576px){
    .single-post .section-post-header .swiper.swiper-3-cols{
        width:calc(100% + 66px);
        transform:translateX(-33px)
    }
}
@media(max-width:767px){
    .swiper.swiper-3-cols .swiper-slide .swiper-image{
        object-fit:cover;
        object-position: center;
        aspect-ratio: 16/9;
        margin-bottom: 50px;
    }


}
@media(min-width:575px){
    .swiper.swiper-3-cols .nano-swiper-pagination{
        top:322px;
    }
}
@media(min-width:768px){
    .swiper.swiper-3-cols{
        width:calc(100% - 40px);
        margin-top: 40px;
    }
    .swiper.swiper-3-cols .nano-swiper-pagination,
    .swiper.swiper-3-cols.nav-left .nano-swiper-pagination
    {
        position:absolute;
        bottom:100%;
        top:initial;
        right:0;
        left:initial
    }

}
.swiper.swiper-3-cols.nav-left .nano-swiper-pagination{
    width: 130px;
}
.swiper.swiper-3-cols.nav-left .nano-swiper-pagination>.nano-slider-prev+span{
    visibility: hidden;
}
@media(min-width:1240px){
    .swiper.swiper-3-cols .swiper-slide.swiper-slide-prev,
    .swiper.swiper-3-cols .swiper-slide.swiper-slide-next,
    .swiper.swiper-3-cols .swiper-slide.swiper-slide-active{
        opacity:1
    }
    .swiper.swiper-3-cols.nav-left .nano-swiper-pagination{
        bottom:initial;
        top:44px;
        right:100%;
        left:initial
    }
    .swiper.swiper-3-cols.nav-left .swiper-slide img{
        aspect-ratio: 5/3;
        object-fit: cover;
        object-position: center;
        display: block;
    }
}


/*swiper thumbnails*/
.swiper.swiper-thumbnails{

}
.swiper-thumbnails .swiper-image{
    aspect-ratio: 16/9;
    object-fit: cover;
    object-position: center;
}
.swiper-thumbnails-container .before-swiper{
    background-color: #0036ec;
    color:#fff;
    padding:40px;

}
.swiper-thumbnails-container .before-swiper h6{
    color:#fff
}
.swiper-thumbnails-container .swiper+div>div{
    position: relative;
}
.swiper-thumbnails-container>div:first-child{
    display:flex;
    flex-direction: column-reverse
}
.swiper.swiper-thumbnails .swiper-image-container+div{
    padding: 30px;
	box-sizing: border-box;
	max-width: 100vw;
}
.swiper-slide.has-video .swiper-image-container{
    position: relative;
}
.swiper-slide.has-video .swiper-image-container a.video-link{
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    /* background-image:url('../img/icons/icon-play.png'); */
    background-size:60px;
    background-repeat: no-repeat;
    background-position: center;
}
.swiper-thumbnails-thumbs .swiper-slide.has-video .swiper-image-container{
    position: relative
}
.swiper-thumbnails-thumbs .swiper-slide.has-video .swiper-image-container::after{
    content:'';
    display:block;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-image:url('../img/icons/icon-play.png');
    background-size:30px;
    background-repeat: no-repeat;
    background-position: center;
}
.swiper.swiper-thumbnails-thumbs{
    display:none
}
.swiper-thumbnails{
    display:flex;
    align-items: flex-start;
    flex-wrap:wrap;
    flex-direction: column-reverse;
}
.swiper-thumbnails .swiper-slide{
    opacity:1;
    transition:opacity ease-in-out .3s
}
.swiper-thumbnails .swiper-slide:not(.swiper-slide-active){
    opacity: 0;
}
.swiper-thumbnails-thumbs .swiper-slide{
    /* height:200px!important */
}
.swiper-thumbnails-thumbs .swiper-slide{
    overflow: hidden;
}
.swiper-thumbnails .swiper-wrapper+div{
    position:relative
}
.swiper-thumbnails-container .nano-swiper-pagination{
    position: absolute;
    z-index:999;
    top:100%;
    right:0
}
.swiper-thumbnails .swiper-image{
    width:100%
}
.swiper-thumbnails-container .swiper-thumbnails .swiper-slide{
    width:100%!important
}
@media(min-width:768px){
    .swiper-thumbnails-container .swiper-thumbnails .swiper-slide{
        width:100%!important
    }
}
@media(min-width:1024px){
    .swiper-thumbnails-container{
        display:grid;
        grid-template-columns:1fr 207px;
        gap:15px

    }
    .swiper.swiper-thumbnails-thumbs{
        display:block;
        height:366px
    }
    /* .swiper.swiper-thumbnails-thumbs .swiper-slide{
        height:122px!important;
        overflow:hidden;
        padding-bottom:5px;
        box-sizing: border-box;


    } */
    .swiper.swiper-thumbnails-thumbs .swiper-slide img{
        display: block;
    }

    /* .swiper-thumbnails-container{
        display:flex;
        justify-content: space-between;

    }
    .swiper-thumbnails-container>div:first-child{
        width:calc(100% - 217px);
        position:relative;
    }
    .swiper-thumbnails-container>div:nth-child(2){
        width:calc(207px - 5px)
    }
    .swiper.swiper-thumbnails-thumbs{
        display:block;
        height:366px
    } */


}
@media(min-width:1240px){
    .swiper-thumbnails-container .before-swiper{
        width:calc(100% + 140px);
        transform:translateX(-140px)
    }
    .swiper-thumbnails-container>div:first-child{
        display:grid;
        grid-template-columns: 1fr 651px;
    }
    .swiper-thumbnails-container>div:first-child .swiper{order:1}
    /* .swiper-thumbnails{
        flex-direction: row-reverse;
    }
    .swiper-thumbnails>div{
        width:100%
    }
    .swiper-thumbnails>div:nth-child(2){
        flex-grow:1;
        width:140px;
        position: relative;
        z-index:80
    }
    .swiper-thumbnails>div:nth-child(1){
        width:651px
    } */
}

/*slider 2-5*/

.swiper-2-5-cols .swiper-slide .swiper-image-container{
    background-color: #c9c9c9;

    box-sizing: border-box;
    text-align:center
}
.swiper-2-5-cols .swiper-slide:not(.no-padding) .swiper-image-container{
    padding:10px;
}
.swiper-2-5-cols .swiper-slide.photo .swiper-image-container img{
    display:block
}
.swiper-2-5-cols .swiper-slide.photo .swiper-image-container img{
aspect-ratio:16/9;
object-fit: cover;
object-position: center;
width: 100%;
}

.swiper-2-5-cols .swiper-slide .swiper-image-container:empty{
    padding:0px;
    display:none
}

.swiper-2-5-cols .swiper-wrapper{
    align-items:stretch;

}
.swiper-2-5-cols .swiper-wrapper .swiper-slide{
    height: auto!important;
    background-color: #fff;

}
.swiper-2-5-cols .swiper-slide .swiper-image-container+div{
    padding:10px;
    display:flex;
    align-items: center;
    background-color: #fff;
}
.swiper-2-5-cols .swiper-slide .swiper-image-container+div:empty{
    display:none
}
.swiper-2-5-cols .swiper-wrapper{
    margin-top:40px
}
.swiper-2-5-cols .nano-swiper-pagination{
    position: absolute;
    top:0;
    left:0
}

@media(min-width:1240px){
    .swiper-2-5-cols .swiper-wrapper .swiper-slide>div{
        display:grid;
        grid-template-columns: 1fr 1fr;
        height: 100%;
    }
    .swiper-2-5-cols .swiper-wrapper .swiper-slide.photo .swiper-image-container{
        position: relative;
        min-height:150px
    }
    .swiper-2-5-cols .swiper-wrapper .swiper-slide.photo .swiper-image-container img{
        aspect-ratio: initial;
        height:100%;
        width:100%;
        position: absolute;
        top:0;
        left:0;
        right:0;
        bottom:0
    }
}
/*slider about*/
.swiper-about-container{
    display:flex;
    flex-direction:column-reverse
}
.swiper-about-container .swiper{
    width:100%;
    overflow:visible
}
.swiper-about-container .swiper .swiper-slide,
.swiper-about-container .swiper .swiper-slide-prev,
.swiper-about-container .swiper .swiper-slide-duplicate
{
    opacity:0;
    /* transition:opacity ease-in-out .6s */
}
.swiper-about-container .swiper .swiper-slide.swiper-slide-active,
.swiper-about-container .swiper .swiper-slide-duplicate.swiper-slide-active,
.swiper-about-container .swiper .swiper-slide.swiper-slide-next,
.swiper-about-container .swiper .swiper-slide-duplicate.swiper-slide-next
{
    opacity:1
}
.swiper-about-container .swiper-image-container img{
    aspect-ratio:16/9;
    object-fit: cover;
    width:100%
}
.swiper-about-container .before-swiper{
    padding:40px;
    box-sizing: border-box;

}
.swiper-about-container .nano-swiper-pagination{
    position:absolute;
    top:100%;
    right:0;
    z-index:999
}
.swiper-about-container .swiper+div{
    position: relative;
    z-index:99
}
.swiper-about-container .swiper+div>div{
    position:relative
}
@media(min-width:1024px){
    .swiper-about-container{
        display:grid;
        grid-template-columns:300px 800px
    }
    .swiper-about-container .swiper{order:2}
}
@media(min-width:1240px){
    .swiper-about-container{
        grid-template-columns:300px 940px
    }

}
@media(min-width:1692px){
    .swiper-about-container .before-swiper{
        width:calc(100% + 120px);
        transform:translateX(-120px)
    }
}
.swiper-slide{
    -webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
}

/*swiper phone*/
.swiper-phone-container{
    display:flex;
    flex-direction:column-reverse;
    position: relative;
    justify-content: flex-end;
}
.swiper-phone{
    width: 281px;
}
.swiper-phone.swiper{
    margin-left: 0;
    margin-right: initial;
    overflow:visible
}
@media(min-width:960px){
    .swiper-phone.swiper{
        margin-left: calc(300px * 2);
    }
}
@media(min-width:1024px){
    .swiper-phone.swiper{
        margin-left: calc(300px * 2);
    }
}
@media(min-width:1240px){
    .swiper-phone.swiper{
        margin-left: calc(300px * 3);
    }
}
.swiper-phone .swiper-slide{
    width:100%;
}
.swiper-phone .swiper-slide > div{
    padding:20px;
    height:100%;
    box-sizing: border-box;
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.swiper-phone .swiper-slide > div .slide-icon-1{
}

.swiper-phone .swiper-slide > div>div{
    margin-top: auto;
    text-align:left;
    width:100%
}
.swiper-phone .swiper-slide h4{
    margin-bottom: 0;
}
.swiper-phone .swiper-slide{
    width:281px;
    height:281px;
    position: relative;
}
.swiper-phone .swiper-slide>div>span:first-child{
    content:'';
    position:absolute;
    left:0;
    width:100vw;
    top:0;
    bottom:0;
    transform:scaleX(0);
    /* transition:transform ease-in-out .3s;
    transform-origin:center left */

}

@media(min-width:940px){
    .swiper-phone .swiper-slide{
        width:281px;
        height:281px
    }
}

.swiper-phone-container .phone-simu{
    width:350px;
    height:712px;
	/* width: 270px;
	height: 550px; */
    border:solid 7px #fff;
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.36);
    display:none;
    position:absolute;
    z-index:9999;
    top:0;
    left:0;
    border-radius:40px;
    background-color: #fff;
}
@media(max-width:1300px){
    .swiper-phone-container .phone-simu{
        transform:  scale(0.8)
    }
}
@media only screen and (max-width: 959px) {
	.swiper-phone-container .phone-simu{
	    /* width:350px;
	    height:712px; */
		width: 270px;
		height: 550px;
		top:30px;
        left:50%;
        transform: translateX(-50%) scale(0.8)
	}
    .swiper-phone-container{
        height:600px
    }
    .swiper-phone-container .swiper-slide{
        width:100vw;
        height:220px;
        margin-left:0!important;
        margin-right:0!important
    }
    .swiper-phone-container .swiper-slide>div *{
        visibility: hidden
    }
    .swiper-phone-container .swiper-phone{
        width: 100vw;
    }
    .swiper-phone-container .nano-swiper-pagination{
        margin-left: auto;
    }
}
.swiper-phone-container .phone-simu >div{
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    background-color: rgb(192, 192, 192);
    height:100%;
    width: 100%;
    border-radius:40px


}
.swiper-phone-container .phone-simu >div:nth-child(1){
    position: relative;
}
.swiper-phone-container .phone-simu >div:nth-child(n+1){
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0
}
.swiper-phone-container .phone-simu >div.status-bar{
    bottom:initial;
    left:10px;
    right:10px;
    top:5px;
    height:30px;
    background-image:url(../img/icons/phone-status-bar.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity:1;
    background-color: transparent;
    width:auto;

}
.swiper-phone-container .phone-simu [data-slide]{
    opacity:0;
    transition:opacity ease-in-out .3s
}
.swiper-phone-container .phone-simu [data-slide].is-active{
    opacity: 1;
}
@media(max-width:959px){
    .swiper-phone-container .phone-simu{
        display:block;
        left:calc(0)
    }
}

@media(min-width:960px){
    .swiper-phone{
        transform:translateX(-7px)
    }
    .swiper-phone .swiper-slide.swiper-slide-active>div>span:first-child{
        transform:scaleX(1)
    }
    .swiper-phone-container{
        height:750px;
    }
    .swiper-phone-container .nano-swiper-pagination{
        margin-top: 200px;
    }
    .swiper-phone.swiper
    {
        margin-left: calc(300px * 2);
    }
    .swiper-phone-container .phone-simu{
        display: block;
        left:calc(300px * 2)
    }
}
@media(min-width:1240px){
    .swiper-phone.swiper{
        margin-left: calc(300px * 3);
    }
    .swiper-phone-container .phone-simu{
        left:calc(300px * 3)
    }
}

.swiper-phone-container .phone-simu .phone-simu-icon{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    opacity:0;
    transition: all cubic-bezier(0.68, -0.55, 0.27, 1.55) .6s
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon{
    opacity:1
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-0{
    transform:translate(-240px,-226px)
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-1{
    transform:translate(calc(197px - 100%),-216px)
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-2{
    transform:translate(calc(188px - 100%),-26px)
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-3{
    transform:translate(calc(190px - 100%),80px)
}
.swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-4{
    transform:translate(-258px,196px)
}
@media(max-width:640px){    
    .swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-0{
        transform:translate(-155px,-226px)
    }
    .swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-1{
        transform:translate(calc(160px - 100%),-180px)
    }
    .swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-2{
        transform:translate(calc(162px - 100%),-26px)
    }
    .swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-3{
        transform:translate(calc(168px - 100%),80px)
    }
    .swiper-phone-container .phone-simu [data-slide].icon-position .phone-simu-icon-4{
        transform:translate(-180px,196px)
    }
}
