html, body, div, span,
h1, h2, h3, h4, h5, h6, p, pre,
a, img, small, strike, strong, sub, sup,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, section, time, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }
  body * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

@font-face {
  font-family: 'NouvelR';
  src: url("../newFonts/NouvelR-Light.woff2") format("woff2"), url("../newFonts/NouvelR-Light.woff") format("woff");
  font-weight: 200;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR';
  src: url("../newFonts/NouvelR-Book.woff2") format("woff2"), url("../newFonts/NouvelR-Book.woff") format("woff");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR';
  src: url("../newFonts/NouvelR-Regular.woff2") format("woff2"), url("../newFonts/NouvelR-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR';
  src: url("../newFonts/NouvelR-Semibold.woff2") format("woff2"), url("../newFonts/NouvelR-Semibold.woff") format("woff");
  font-weight: 600;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR';
  src: url("../newFonts/NouvelR-Bold.woff2") format("woff2"), url("../newFonts/NouvelR-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR';
  src: url("NouvelR-Extrabold.woff2") format("woff2"), url("NouvelR-Extrabold.woff") format("woff");
  font-weight: 800;
  font-style: normal; }

@font-face {
  font-family: 'NouvelR-Variable';
  src: url("../newFonts/NouvelR-Variable.woff2") format("woff2"), url("../newFonts/NouvelR-Variable.woff") format("woff");
  font-weight: 800;
  font-style: normal; }

.slider {
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
  overflow: hidden;
  font-family: 'NouvelR', Arial;
  color: white;
  background: black; }
  .slider .btn {
    position: absolute;
    top: 51.6%;
    left: 1.5rem;
    z-index: 20;
    height: 4.3rem;
    width: 2.5rem;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: url("../img/slider/arrow.svg") no-repeat center center/contain;
    cursor: pointer;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
    will-change: transform;
    outline: none; }
    .slider .btn:hover {
      -webkit-transform: translateY(-50%) scale(1.1);
      transform: translateY(-50%) scale(1.1); }
    .slider .btn.next {
      top: 51%;
      left: auto;
      right: 1.5rem;
      -webkit-transform: translateY(-50%) rotate(180deg);
      transform: translateY(-50%) rotate(180deg); }
      .slider .btn.next:hover {
        -webkit-transform: translateY(-50%) rotate(180deg) scale(1.1);
        transform: translateY(-50%) rotate(180deg) scale(1.1); }
  .slider h1 {
    position: relative;
    z-index: 1;
    padding: 1.95rem 3.7rem 1.55rem;
    font-size: 1.5rem;
    font-weight: 700; }
  .slider h3 {
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.06rem; }
  .slider h4 {
    margin-top: 2.5rem;
    font-family: 'NouvelR', Arial;
    font-size: 1rem;
    font-weight: 700; }
  .slider p {
    margin-top: 0.8rem;
    font-family: 'NouvelR', Arial;
    line-height: 1.45;
    font-size: 0.875rem; }
  .slider ul {
    margin-top: 1.5rem;
    padding-left: 1.8rem;
    padding-right: 1rem;
    font-family: 'NouvelR', Arial;
    font-size: 0.875rem; }
    .slider ul.row {
      margin-top: 1rem;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start; }
      .slider ul.row:not(.first) li:first-of-type {
        width: 38% !important; }
      .slider ul.row:not(.first) li:last-of-type {
        width: 46.6% !important; }
      .slider ul.row li.nb {
        padding-left: 0 !important; }
        .slider ul.row li.nb:before {
          display: none; }
      .slider ul.row.first {
        margin-top: 0;
        padding-left: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column; }
        .slider ul.row.first li {
          width: 100% !important; }
        .slider ul.row.first > li {
          padding-left: 1.8rem; }
          .slider ul.row.first > li:before {
            left: .1rem; }
      .slider ul.row.last {
        width: 100%; }
    .slider ul li {
      position: relative;
      margin-bottom: 1rem;
      line-height: 1.4; }
      .slider ul li:before {
        content: '';
        position: absolute;
        top: 0.1rem;
        left: -1.7rem;
        width: 1rem;
        height: 1rem;
        background: url("../img/slider/square.svg") no-repeat center center/contain; }
  .slider .slide {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; }
  .slider .left {
    position: absolute;
    top: -1rem;
    left: -11%;
    width: 77%; }
    .slider .left:before, .slider .left:after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      height: 10rem;
      background: -webkit-gradient(linear, left top, left bottom, from(#000), to(transparent));
      background: linear-gradient(to bottom, #000, transparent); }
    .slider .left:after {
      top: auto;
      bottom: 2rem;
      background: -webkit-gradient(linear, left bottom, left top, from(#000), to(transparent));
      background: linear-gradient(to top, #000, transparent); }
    .slider .left img {
      width: 100%; }
  .slider .right {
    position: relative;
    z-index: 1;
    width: 35.4%;
    padding-right: 3.5rem; }
  .slider .tabs {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 3.6rem;
    padding: 0 9.9rem 3rem 3.7rem;
    font-family: 'NouvelR', Arial;
    font-size: 1.125rem; }
    .slider .tabs .tab {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: end;
      -ms-flex-align: end;
      align-items: flex-end;
      height: 2.5rem;
      cursor: pointer;
      -webkit-transition: opacity 0.3s;
      transition: opacity 0.3s; }
      .slider .tabs .tab:nth-of-type(2) {
        margin-right: 4.3rem; }
      .slider .tabs .tab:nth-of-type(3) {
        margin-right: 3.9rem; }
      .slider .tabs .tab.active:before {
        opacity: 0; }
      .slider .tabs .tab.active:after {
        opacity: 1; }
      .slider .tabs .tab:hover {
        opacity: 0.7; }
      .slider .tabs .tab:before, .slider .tabs .tab:after {
        content: '';
        position: absolute;
        top: 0;
        left: -2px;
        width: 15rem;
        height: 6px;
        background: url("../img/slider/line.svg") no-repeat center bottom/100% auto;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s; }
      .slider .tabs .tab:after {
        opacity: 0;
        background-image: url("../img/slider/active.svg"); }

@media screen and (max-width: 1023px) {
  html {
    font-size: 5vw; }
  .slider {
    width: 100vw;
    max-width: 100vw;
    min-width: 100vw;
    background: transparent;
    color: black; }
    .slider ul li {
      font-size: .875rem; }
    .slider .first {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      padding-left: 1rem !important; }
      .slider .first > li {
        padding-left: 1.8rem; }
        .slider .first > li:before {
          left: .1rem; }
    .slider .nb {
      padding-left: 0 !important; }
      .slider .nb:before {
        display: none; }
    .slider .swiper-container {
      width: 100%; }
    .slider h1 {
      padding: 1.15rem 0.7rem;
      color: black;
      text-align: center; }
    .slider .btn {
      display: none; }
    .slider .left {
      position: static;
      top: 0;
      width: 100%; }
      .slider .left:before, .slider .left:after {
        display: none; }
    .slider .right {
      width: 100%;
      margin-top: 1rem;
      padding: 0 1rem; }
    .slider .slide {
      display: block;
      overflow: hidden; }
    .slider .tabs {
      position: absolute;
      top: 72vw;
      width: 140%;
      margin: 0;
      padding: 0 1rem;
      font-size: 0.63rem;
      color: white;
      -webkit-transition: -webkit-transform .5s;
      transition: -webkit-transform .5s;
      transition: transform .5s;
      transition: transform .5s, -webkit-transform .5s; }
      .slider .tabs.t1 {
        -webkit-transform: translateX(-30%);
        transform: translateX(-30%); }
        .slider .tabs.t1:after {
          left: auto;
          right: calc(100vw - 7rem);
          background: -webkit-gradient(linear, left top, right top, from(#000), to(transparent));
          background: linear-gradient(to right, #000, transparent); }
      .slider .tabs:after {
        /* content: '';
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                height: 3rem;
                left: calc(100vw - 7rem);
                width: 7rem;
                background: linear-gradient(to left, #000, transparent);
                pointer-events: none;*/ }
      .slider .tabs .tab {
        height: auto; }
        .slider .tabs .tab:nth-of-type(2) {
          margin-right: 0; }
        .slider .tabs .tab:nth-of-type(3) {
          margin-right: 0; }
        .slider .tabs .tab:before, .slider .tabs .tab:after {
          top: -0.8rem;
          left: -2px;
          width: 90%;
          background-position: right bottom;
          background-image: url("../img/slider/line-mobile.svg"); }
        .slider .tabs .tab:after {
          background-image: url("../img/slider/active-mobile.svg"); }
    .slider ul.row {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column; }
      .slider ul.row.last li {
        width: 100% !important; }
        .slider ul.row.last li:first-of-type {
          width: 100% !important; }
        .slider ul.row.last li:last-of-type {
          width: 100% !important; }
    .slider ul li:before {
      background-image: url("../img/slider/squareM.svg"); } }

.fade-enter-active, .fade-leave-active {
  -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, -webkit-transform 0.5s;
  transition: opacity 0.5s, transform 0.5s;
  transition: opacity 0.5s, transform 0.5s, -webkit-transform 0.5s; }

.fade-enter, .fade-leave-to {
  opacity: 0; }

.fade-enter .left {
  -webkit-transform: scale(1.1);
  transform: scale(1.1); }

.fade-enter-active .left {
  -webkit-transition: 0.3s;
  transition: 0.3s; }

.fade-leave-active .left {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  -webkit-transition: .3s;
  transition: .3s; }

@media screen and (max-width: 1100px) and (min-width: 900px) {
  html {
    font-size: 13px; } }

/*@media screen and (max-width: 1023px) and (min-width: 700px){
    html{
        font-size: 32px;
    }
    .slider h1{
        max-width: 100%;
    }
}*/
/*@media screen and (min-width: 600px){
    html {
        font-size: 100%;
    }
}*/
/*

@media screen and (max-width: 600px) and (orientation: landscape){
    html{
        font-size: 97%;
    }
}

@media screen and (max-width: 400px){
    html{
        font-size: 124%;
    }
}
@media screen and (max-width: 375px){
    html{
        font-size: 117%;
    }
}

@media screen and (max-width: 360px){
    html{
        font-size: 114%;
    }
}

@media screen and (max-width: 320px){
    html{
        font-size: 100%;
    }
}
*/
@media screen and (max-width: 1023px) and (min-width: 550px) {
  .slider h1 {
    font-size: 24px; }
  .slider h3 {
    font-size: 24px; }
  .slider .tabs {
    top: 63vw; }
  .slider ul li {
    font-size: 14px; }
  .slider ul li:before {
    width: 25px;
    height: 25px;
    top: -4px; }
  .slider ul.row.first > li {
    padding-left: 1.2rem; }
  .slider h4 {
    margin-top: 5px;
    font-size: 18px; }
  .slider ul {
    padding-left: 1.2rem; }
  .slider ul li:before {
    left: -1rem; }
  .slider ul.row.first > li {
    margin-bottom: 20px; }
  .slider ul.row.last li {
    margin-bottom: 20px; }
  .slider ul.row {
    margin-top: 20px; } }