.about--front--slider {
    position   : relative;
    box-sizing : border-box;
}

@media all and (max-width : 760px) {
    .about--front--slider > .wrap {
        margin : 0;
    }
}

@media all and (min-width : 760px) {
    .about--front--slider {
        border-radius : 1.6rem;
        overflow      : hidden;
    }
}

.about--front--slider .slider--wrapper {
    position : relative;
    overflow : hidden;
}

@media all and (min-width : 760px) {
    .about--front--slider .slider--wrapper {
        border-radius : 1.5rem;
    }
}

.about--front--slider--wrapper {
    position   : relative;
    z-index    : 100;
    box-sizing : border-box;

    width      : 100%;
}
.about--front--slider .about--front--slider--images {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}
.about--front--slider .about--front--slider--images .tns-item {
    height: 100%;
}
.about--front--slider .about--front--slider--images .tns-item picture {
    width: 100%;
    height: 100%;
}
.about--front--slider .about--front--slider--images .tns-item picture img {
    object-fit: cover;
    object-position: center;
    min-width: 100%;
    min-height: 100%;
}
@media all and (min-width : 760px) {
    .about--front--slider--wrapper {
        height : 100%;
    }
	.about--front--slider .about--front--slider--images .tns-item picture img {
		aspect-ratio : 2;
	}
}
@media all and (min-width : 1280px) {
	.about--front--slider .about--front--slider--images .tns-item picture img {
		aspect-ratio : 2.5;
	}
}
@media all and (min-width : 1380) {
	.about--front--slider .about--front--slider--images .tns-item picture img {
		width: 1024px;
		aspect-ratio: 3;
		height: auto;
		min-width: 100%;
		line-height: 300%;
	}
}

@media all and (min-width : 760px) {
    .about--front--slider--wrapper .padder {
        box-sizing : border-box;
        height     : 100%;
        padding    : 1.6rem;
    }
}

.about--front--slider--wrapper .wrapper {
    box-sizing       : border-box;
    background-color : var(--color--white--semitransparent);
    position         : relative;
    padding          : 4.2rem;
    margin           : 2rem;
    border-radius    : 1.6rem;
    margin-bottom    : 200px;
}

@media all and (min-width : 760px) {
    .about--front--slider--wrapper .wrapper {
        margin         : 0;
        border-radius  : 0.8rem;
        padding        : 4.2rem;
        padding-bottom : 8rem;
        height         : 100%;
        width          : 67%;
        margin-left    : 33%;
    }
}

@media all and (min-width : 760px) {
    .about--front--slider--wrapper .wrapper {
        width       : 50%;
        margin-left : 50%;
    }
}

@media all and (min-width : 1280px) {
    .about--front--slider--wrapper .wrapper {
        width       : 33%;
        margin-left : 67%;
    }
}

.about--front--slider--wrapper .wrapper .tns-slider {
    display : flex;
}

.about--front--slider--wrapper .wrapper .tns-item {
    margin-right : -100%;
    position     : static !important;
}

.about--front--slider--items .item h3 {
    margin-top : 0;
    font-size  : 2.4rem;
}

@media all and (min-width : 760px) {
    .about--front--slider--items .item h3 {
        font-size : 3.2rem;
    }
}

.about--front--slider--items .item .description {
    margin : 1.6rem 0;
}

.about--front--slider--nav {
    margin          : 0;
    margin-top      : 0.8rem;
    padding         : 0;
    width           : 100%;
    display         : flex;
    flex-direction  : row;
    justify-content : center;
    align-items     : center;
}

@media all and (min-width : 760px) {
    .about--front--slider--nav {
        position : absolute;
        right    : 0;
        width    : 100%;
        bottom   : 3rem;
    }
}

.about--front--slider--nav span {
    box-sizing : border-box;
    margin     : 0 0.5rem;
    cursor     : pointer;
}

.about--front--slider--nav svg {
    width   : 3rem;
    height  : 3rem;
    display : block;
}

.about--front--slider--nav svg circle.dot {
    fill    : var(--color--gray);
    opacity : 0.5;
}

.about--front--slider--nav svg circle.progress {
    fill              : none;
    stroke            : var(--color--gray);
    stroke-dasharray  : 100 100;
    stroke-dashoffset : 0;
    stroke-linecap    : round;
    stroke-width      : 2;
    transition        : stroke-dashoffset 5s linear;
    opacity           : 0;
}

.about--front--slider--nav .tns-nav-active svg {
    visibility : visible;
}

.about--front--slider--nav .tns-nav-active svg circle.dot {
    fill    : var(--color--purple);
    opacity : 1;
}

.about--front--slider--nav .tns-nav-active svg circle.progress {
    opacity           : 0.5;
    stroke-dashoffset : 100;
}

.about--front--slider--images .item picture {
    display : block;
}

/*# sourceMappingURL=style.css.map */
