@font-face {
    font-family: 'DINPro';
    src: url('../fonts/DINPro.eot'); /* IE9 Compat Modes */
    src: url('../fonts/DINPro.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/DINPro.woff') format('woff'), /* Pretty Modern Browsers */
         url('../fonts/DINPro.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('../fonts/DINPro.svg#svgFontName') format('svg'); /* Legacy iOS */
     font-weight: 400;    
}
  
@font-face {
      font-family: 'DINPro-CondensedBold';
      src: url('../fonts/DINPro-CondensedBold.eot'); /* IE9 Compat Modes */
      src: url('../fonts/DINPro-CondensedBold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
           url('../fonts/DINPro-CondensedBold.woff') format('woff'), /* Pretty Modern Browsers */
           url('../fonts/DINPro-CondensedBold.ttf')  format('truetype'), /* Safari, Android, iOS */
           url('../fonts/DINPro-CondensedBold.svg#svgFontName') format('svg'); /* Legacy iOS */
       font-weight: 700;    
}

@font-face {
    font-family: 'DINPro-CondensedMedium';
    src: url('../fonts/DINPro-CondensedMedium.eot'); /* IE9 Compat Modes */
    src: url('../fonts/DINPro-CondensedMedium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/DINPro-CondensedMedium.woff') format('woff'), /* Pretty Modern Browsers */
         url('../fonts/DINPro-CondensedMedium.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('../fonts/DINPro-CondensedMedium.svg#svgFontName') format('svg'); /* Legacy iOS */
     font-weight: 500;    
}

@font-face {
    font-family: 'DINPro';
    src: url('../fonts/DINPro-Medium.eot'); /* IE9 Compat Modes */
    src: url('../fonts/DINPro-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/DINPro-Medium.woff') format('woff'), /* Pretty Modern Browsers */
         url('../fonts/DINPro-Medium.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('../fonts/DINPro-Medium.svg#svgFontName') format('svg'); /* Legacy iOS */
     font-weight: 500;    
}
    
@font-face {
    font-family: 'DINPro';
    src: url('../fonts/DINPro-Bold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/DINPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/DINPro-Bold.woff') format('woff'), /* Pretty Modern Browsers */
         url('../fonts/DINPro-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('../fonts/DINPro-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
     font-weight: 700;    
}

body {
    margin: 0;
}

.page-opti {
    padding: 0;
    margin: 0 auto;
    font-family: 'DINPro';
    color: #fff;
    background-color: #181818;
    position: relative;
}

.page-opti section {
    position: relative;
}

.bg-page {
    position: absolute;
    top: 0;
    z-index: 0;
    mix-blend-mode: overlay;
    width: 100%;
    height: 100%;
}

.opti-container,
.opti-programm-added {
    max-width: 1320px;
    margin: auto;
}

.opti-title {
    font-weight: 500;
    font-size: 48px;
    text-transform: uppercase;
    line-height: 1.1em;
    margin: 0 0 16px;
    font-family: 'DINPro-CondensedMedium';
}

.opti-text {
    font-size: 20px;
    line-height: 1.3em;
    margin: 0;
}

a, button, input, svg, svg path, img, rect, path {
    transition: all 0.5s ease;
}

input, input:hover, input:focus, input:active,
button, button:hover, button:focus, button:active {
    outline: none;
}

.page-opti ul, .page-opti li {
    display: block;
    margin: 0;
    padding: 0;
}

.page-opti img, .page-opti video, svg {
    max-width: 100%;
    vertical-align: middle;
}

div, li, a {
    box-sizing: border-box;
}

.no-wrapp {
    white-space: nowrap;
}

.opti-mob,
.header__burger,
.opti-programm-added__item img.opti-mob,
.opti-apps-content__mob,
.opti-header__fixed,
.opti-programm__mob,
.swiper-dots,
.swiper-pagination-table {
    display: none;
}

.page-opti .btn {
    background: #E02E2B;
    border-radius: 4px;
    width: 100%;
    max-width: 121px;
    display: inline-block;
    color: #fff;
    font-weight: 500;
    font-size: 18px;
    line-height: 1em;
    letter-spacing: -0.02em;
    text-decoration: none;
    text-align: center;
    padding: 11px 0;
}

/* header */

.header {
    background: #000;
    display: flex;
    align-items: center;
    padding: 10px 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

 .header .opti-container {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 1310px;
    margin: auto;
    justify-content: space-between;
}

.header__logos {
    display: flex;
    align-items: center;
}

.header__logos a {
    display: flex;
    max-width: 141px;
}

.header__logos a:first-child:after {
    content: '';
    display: block;
    height: 28px;
    width: 1px;
    background-color: #fff;
    margin: 0 20px;
}

.header__logos a:last-child {
    max-width: 121px;
}

.page-opti .header__nav {
    display: flex;
}

.header__nav a {
    font-size: 18px;
    line-height: 1.2em;
    color: #fff;
    margin: 0 16px;
    transition: .3s;
    text-decoration: none;
}

.header .btn {
    max-width: 155px;
}

.header__nav .active a,
.header__item:hover {
    color: #E02E2B;
}

/* opti-banner */

.opti-banner {
    position: relative;
}

.banner-wrapper {
    position: absolute;
    right: 14vw;
    top: 40px;
    max-width: 600px;
    width: 100%;
    text-align: center;
}

.banner-wrapper .banner-wrapper__icon {
    display: block;
    margin-bottom: 14px;
}

.banner-wrapper .banner-wrapper__icon_last{
    margin: 12px 0 0 auto;
}

.banner-wrapper h2 {
    font-size: 70px;
    font-family: 'DINPro-CondensedBold';
    margin: 0;
    text-transform: uppercase;
}

.banner-wrapper p {
    text-transform: uppercase;
    margin: 6px 0 0;
    font-size: 28px;
    font-weight: 500;
}

.banner-wrapper .btn {
    max-width: 259px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
    font-size: 18px;
    margin: 48px auto 0;
}

.banner-wrapper .btn svg {
    margin: 0 10px 0 0;
}

/* .opti-advantages */

.opti-advantages {
    padding: 48px 0 82px;
    margin-top: -100px;
}

.opti-advantages .opti-container {
    max-width: 1168px;
}

.opti-advantages h2 {
    font-size: 64px;
    font-weight: 500;
    line-height: 1.1em;
    text-align: center;
    text-transform: uppercase;
    font-family: 'DINPro-CondensedMedium';
    margin: 0;
}

.swiper-advantages {
    margin-top: 48px;
}

.swiper-advantages .swiper-wrapper {
    justify-content: space-between;
}

.swiper-advantages .swiper-slide {
    width: 100%;
    max-width: 19%;
    text-align: center;
    cursor: pointer;
    display: block;
    text-decoration: none;
    color: #fff;
}

.swiper-advantages .swiper-slide img {
    display: block;
    max-width: 112px;
    margin: auto;
}

.swiper-advantages .swiper-slide p {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.3em;
    margin: 16px 0 0;
}

/* opti-preview */

.opti-preview {
    margin-bottom: 72px;
}

.opti-preview .opti-container {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background-color: #181818;
}

.opti-preview__content {
    width: 100%;
    max-width: 485px;
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.opti-preview__content .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 250px;
    background-color: transparent;
    color: #fff;
    border: 1px solid #FFF;
    border-radius: 8px;
    margin-top: 64px;
    font-size: 20px;
    transition: all .5s;
    cursor: pointer;
}

.opti-preview__content .btn:hover {
    background-color: #fff;
    color: #191919;
}

.opti-preview__content .btn:hover svg rect {
    fill: #191919;
}

.opti-preview__content .btn:hover svg path {
    fill: #fff;
}

.opti-preview__content svg {
    margin-right: 10px;
}

.opti-preview__content_left .opti-preview__content {
    left: 24px;
}

.page-opti .opti-preview__video {
    width: 100%;
    max-width: 66%;
    min-height: 500px;
    object-fit: cover;
}

.page-opti .opti-preview__video.w58 {
    max-width: 58%;
}

.page-opti .opti-preview__content_left .opti-preview__video {
    display: block;
    margin-left: auto;
    position: relative;
}

.opti-preview__indicator {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

.opti-preview__indicator {

}

.opti-preview__auto {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

.m0 {
    margin: 0;
}


/* swiper-functions */

.opti-row .opti-container,
.opti-programm .opti-container,
.opti-programm-added {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.opti-row__content {
    max-width: 35%;
}


/* opti-programm */

.opti-programm {
    margin-top: 24px;
    margin-bottom: 72px;
}

.opti-programm-content__list li:first-child {
    width: 0;
    height: 0;
}

.opti-programm-content__list li:nth-child(2) {
    margin-left: -15px;
}

.opti-programm__left {
    max-width: 54%;
}

.opti-programm__tabs {
    position: relative;
    display: none;
    margin-top: 30px;
}

.opti-programm__tabs p {
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.2em;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 21px;
    margin: 0;
}

.opti-programm__left img {
    border-radius: 16px;
    
    
}

.opti-programm-content {
    max-width: 40%;
}

@keyframes fade-in {
    from { opacity: 0; transform: translateY(-500px); }
    to { opacity: 1; transform: translateY(0); }
}

.page-opti .opti-programm-content__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 48px;
}

.opti-programm-content__list li {
    max-width: 23%;
    width: 100%;
    text-align: center;
    margin-bottom: 24px;
}

.opti-programm-content__list li img {
    width: 100%;
    max-width: none;
    border-radius: 16px;
}

.opti-programm-content__list li p {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -0.02em;
    line-height: 1.2em;
    margin: 8px 0 0;
}

.opti-programm-content__list li:hover img,
.opti-programm-content__list li.active img {
    box-shadow: 0px 0px 30px 0px rgba(255, 4, 0, 0.70);
}

/* opti-programm-added */

.opti-programm-added {
    margin-top: 43px;
    justify-content: flex-start;
}

.opti-programm-added h3 {
    font-size: 38px;
    max-width: 256px;
}

.opti-programm-added__item {
    display: flex;
    align-items: center;
    margin-left: 65px;
}

.opti-programm-added__item img {
    max-width: 145px;
    border-radius: 16px;
    display: block;
    margin-right: 16px;
}

.opti-programm-added__item div {
    width: 100%;
    max-width: 284px;
}

.opti-programm-added__item h4 {
    text-transform: uppercase;
    font-size: 24px;
    font-family: 'DINPro-CondensedMedium';
    margin: 0 0 8px;
    font-weight: 500;
}

.opti-programm-added__item p {
    font-size: 16px;
    margin: 0;
    letter-spacing: -0.02em;
}

/* opti-flex */

.opti-flex {

}

.opti-flex .opti-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1290px;
}

.opti-flex-card {
    display: flex;
    align-items: center;
    padding: 28px;
    position: relative;
    background-color: #000;
    border-radius: 16px;
    width: 100%;
    max-width: 49%;
    overflow: hidden;
}

.page-opti img.opti-flex-card__icon {
    max-width: 150px;
    border-radius: 100px;
}

.opti-flex-card p {
    font-size: 18px;
    line-height: 1.3em;
    margin: 0 0 0 34px;
}

.opti-flex-card__bg {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}

/* opti-video-banner */

.opti-video-banner {
    margin-top: 72px;
}

.opti-video-banner .opti-title {
    text-align: center;
    font-size: 64px;
}

.opti-video-banner__wrapper div {
    position: relative;
    margin-top: 24px;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
}

.opti-video-banner__wrapper svg {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 24px;
    border: 1px solid #fff;
    border-radius: 12px;
    width: 120px;
    height: 90px;
    box-sizing: border-box;
}

.opti-video-banner__wrapper:hover svg {
    background-color: #fff;
}

.opti-video-banner__wrapper:hover path {
    fill: #191919;
}

/* table */

.opti-table {
    margin-top: 72px;
}

.opti-table .opti-title,
.opti-nozzles .opti-title {
    font-size: 64px;
}

.opti-table .opti-title {
    margin-bottom: 8px;
}

.opti-table .opti-title,
.opti-table .opti-text,
.opti-nozzles .opti-title,
.opti-nozzles .opti-text {
    text-align: center;
}

.opti-table .btn {
    padding: 11px 0;
    max-width: 115px;
    font-size: 18px;
    border-radius: 4px;
    font-weight: 700;
}

.opti-table__slider {
    padding-bottom: 39px;
}

.open-table-popup {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    cursor: pointer;
}

/* modal-table */

.opti-modal-wrapper {
    display: flex;
    width: 100%;
    height: 100vh;
    justify-content: center;
    align-items: center;
    position: relative;
}

#btn-open {
    width: 150px;
    height: 40px;
    background-color: red;
    color: #ffffff;
    font-size: 22px;
    border-radius: 20px;
    cursor: pointer;
}

#opti-wrapper-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    display: none;
    
    z-index: 10000;
}

#opti-wrapper-modal.active {
    display: flex;
}

#overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: gray;
    opacity: 0.5;
}

#modal-window {
    background: #1c1c1c;
    max-width: 530px;
    width: 100%;
    padding: 86px 32px 32px;
    margin: auto;
    position: relative;
    border-radius: 16px;
    z-index: 1;
}

#btn-close {
    background: transparent;
    outline: none;
    border: none;
    position: absolute;
    right: 32px;
    top: 32px;
}

.opti-wrapper-modal__content ul {
    display: flex;
    justify-content: space-between;
}

.opti-wrapper-modal__content ul li {
    max-width: 100px;
    text-align: center;
}

.opti-wrapper-modal__content ul li p {
    font-size: 14px;
    font-weight: 500;
    margin: 8px 0;
    text-transform: uppercase;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
    
.opti-table__content {
    display: flex;
    margin: 32px auto 0;
    position: relative;
    max-width: 1090px;
}

.page-opti .choise__main-item-image {
    display: block;
    margin: auto;
    max-width: 200px;
}

.choise__main-item-news {
    position: relative;
    max-width: 200px;
}

.choise__main-item-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1em;
    margin: 8px 0;
    color: #fff;
}

.choise__main-item-number {
    color: #fff;
    font-size: 16px;
    margin: 0 0 16px;
}

.choise__main-price_inline {
    font-size: 18px;
    color: #4a4a4a;
    line-height: 1.2em;
    margin: 12px 0 4px;
    text-decoration: line-through;
    text-transform: uppercase;
    font-weight: 500;
}

.choise__main-price {
    font-size: 24px;
    font-weight: 500;
    text-transform: uppercase;
    margin: 0 0 16px;
}

.opti-table__characteristics {
    width: 16%;
}

.opti-table__main {
    width: 84%;
    position: relative;
}

.opti-table__image.text-left {
    height: 291px;
}

.opti-table .swiper-slide ul {
    padding: 0;
    margin: auto;
}

.choise__main-item-new {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 73px;
    height: 24px;
    background-color: #E02E2B;
    color: #fff;
    transform: rotate(-13.535deg);
    font-size: 16px;
    position: absolute;
    top: -7px;
    left: 14px;
    border-radius: 3px;
}

.opti-table .swiper-slide ul li {
    position: relative;
}

.opti-table .swiper-slide ul li,
.opti-table__content .opti-table__characteristics ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    color: #fff;
    text-align: center;
    font-size: 18px;
    line-height: 1.3em;
    font-weight: 400;
    border-bottom: 1px solid transparent;
    height: 78px;
}

.opti-table__content .opti-table__characteristics ul li:last-child {
    letter-spacing: -0.01em;
}

.opti-table .swiper-slide ul li.table-price {
    font-size: 24px;
    font-weight: 700;
}

.opti-table__characteristics ul {
    margin-left: 0;
}

.opti-table .swiper-slide {
    padding-top: 16px;
}

.opti-table__content .opti-table__characteristics ul li {
    text-transform: uppercase;
    text-align: left;
    justify-content: flex-start;
    margin-left: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4em;
}

.opti-table .swiper-slide ul li:first-child,
.opti-table__content .opti-table__characteristics ul li:first-child {
    padding: 10px 0 21px;
    flex-direction: column;
    height: auto;
    border-color: transparent;
}

.opti-table__content .opti-table__characteristics ul li:first-child {
    align-items: flex-start;
    height: 48.5px;
}

.opti-table .swiper-slide ul li:nth-child(2),
.opti-table__content .opti-table__characteristics ul li:nth-child(2) {
    height: 90px;
}

.opti-table .swiper-slide ul li:nth-child(4),
.opti-table__content .opti-table__characteristics ul li:nth-child(4) {
    height: 94px;
}

.opti-table .swiper-slide ul li:nth-child(6),
.opti-table__content .opti-table__characteristics ul li:nth-child(6) {
    height: 94px;
}

.opti-table .table-button-next,
.opti-table .table-button-prev {
    width: 64px;
    height: 64px;
    top: 20%;
    position: absolute;
    cursor: pointer;
    width: 36px;
    height: 36px;
}

.opti-table .table-button-next {
    right: -7%;
}

.opti-table .table-button-prev {
    left: -7%;
}

.page-opti .table-button-next:focus-visible,
.page-opti .table-button-prev:focus-visible,
.page-opti .swiper-button-next:focus-visible,
.page-opti .swiper-button-prev:focus-visible,
.opti-video .video-button-next:focus-visible, 
.opti-video .video-button-prev:focus-visible {
    outline: none;
}


.opti-table .swiper-scrollbar-drag,
.opti-video .swiper-scrollbar-drag {
    background: #E02E2B;
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: #393939;
    height: 4px;
    margin-left: -19%;
}

.opti-table__content .swiper-scrollbar.swiper-scrollbar-horizontal {
    width: 118%;
}

.choise-mob {
    display: none;
}

/* opti-nozzles */

.opti-nozzles {
    margin-top: 72px;
}

.opti-nozzles .opti-container {
    background-color: #000;
    padding: 36px 0;
    border-radius: 16px;
}

.opti-nozzles-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 48px auto;
    width: 100%;
    max-width: 752px;
}

.opti-nozzles-row div {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 46%;
}

.opti-nozzles-row div p {
    font-size: 20px;
    line-height: 1.3em;
    margin: 0 0 0 26px;
}

/* nozzles-swiper */

.nozzles-swiper {
    padding-bottom: 40px;
}

.nozzles-swiper .swiper-slide {
    display: flex;
    position: relative;
}

.page-opti .nozzles-swiper__images {
    max-width: 622px;
}

.nozzles-swiper__content {
    width: 100%;
    margin-left: 20px;
    padding-top: 24px;
}

.nozzles-swiper__title {
    font-size: 32px;
    margin: 0;
    font-weight: 500;
}

.nozzles-swiper__text {
    margin: 16px 0 20px;
    font-size: 20px;
    line-height: 1.3em;
    max-width: 440px;
}

.nozzles-swiper__text.w570 {
    max-width: 557px;
}

.page-opti .nozzles-swiper__tabs {
    display: flex;
}

.nozzles-swiper__tabs li {
    width: 110px;
    text-align: center;
    border: 1px solid #fff;
    color: #fff;
    padding: 6px 0;
    border-radius: 4px;
    margin-right: 22px;
    cursor: pointer;
    font-weight: 500;
}

.nozzles-swiper__tabs li.active {
    background-color: #fff;
    color: #000;
}

.nozzles-swiper__model {
    display: none;
}

.nozzles-swiper__model.active {
    display: block;
}

.nozzles-swiper__model h4 {
    font-size: 20px;
    line-height: 1.3em;
    font-weight: 400;
    margin: 22px 0 11px;
    letter-spacing: -0.02em;
}

.page-opti .nozzles-swiper__list {
    display: flex;
    flex-wrap: wrap;
    max-width: 200px;
}

.nozzles-swiper__list li {
    margin-right: 6px;
    text-align: center;
    max-width: 49%;
    margin-bottom: 12px;
}

.nozzles-swiper__list img {
    max-width: 94px;
}

.nozzles-swiper__list li p {
    font-size: 16px;
    margin: 10px 0 0;
}

.nozzles-swiper__item {
    position: absolute;
    right: 79px;
    bottom: 15px;
    text-align: center;
}

.nozzles-swiper__item p {
    font-size: 20px;
    margin: 10px 0;
}

.nozzles-swiper__item .btn {
    max-width: max-content;
    padding: 11px 28px;
    letter-spacing: 0;
    font-weight: 700;
}

.nozzles-swiper .swiper-horizontal>.swiper-pagination-bullets, .nozzles-swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 0;
}

.nozzles-swiper .swiper-pagination-bullet,
.opti-video .swiper-pagination-bullet {
    background: transparent;
    border: 1px solid #fff;
    border-radius: 2px;
    width: 10px;
    height: 10px;
    opacity: 1;
    box-sizing: border-box;
}

.nozzles-swiper .swiper-pagination-bullet-active,
.opti-video .swiper-pagination-bullet-active {
    background: #fff;
}

.nozzles-swiper .swiper-button-next, .nozzles-swiper .swiper-button-prev {
    top: 50%;
}

/* opti-video */

.opti-video {
    margin: 88px 0;
}

.opti-video h2 {
    text-align: center;
}

.opti-video-wrapper {
    position: relative;
    margin-top: 48px;
}

.swiper-video {
    max-width: 1110px;
    width: 100%;
    margin: auto;
    padding-bottom: 70px;
}

.swiper-video .swiper-slide {
    display: block;
    cursor: pointer;
}

.swiper-video .swiper-slide div {
    position: relative;
}

.swiper-video .swiper-slide div svg {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.swiper-video .swiper-slide div img {
    border-radius: 14px;
}

.swiper-video .swiper-slide p {
    text-align: center;
    font-size: 18px;
    margin: 8px 0 0;
}

.swiper-button-next:after, .swiper-button-prev:after {
    display: none;
}

.video-button-next, .video-button-prev {
    width: 48px;
    height: 48px;
    top: 28%;
    position: absolute;
    cursor: pointer;
    width: 36px;
    height: 36px;
}

.video-button-next {
    right: 40px;
} 

.video-button-prev {
    left: 40px;
}

/* opti-preview_reciept */

.opti-preview_reciept .btn {
    background-color: #E02E2B;
    border: transparent;
    max-width: 160px;
    font-size: 18px;
    border-radius: 4px;
    padding: 13px 0;
    margin-top: 32px;
}

.opti-preview_reciept .opti-preview__content {
    left: 76px;
}

/* opti-about */

.opti-about {
    padding: 102px 0;
}

.opti-lifehacks .opti-title {
    text-align: center;
}

.opti-lifehacks .opti-container {
    max-width: 1170px;
}

.opti-about .opti-title {
    text-align: center;
    margin-bottom: 45px;
}

.swiper-about {
    margin-top: 32px;
}

.swiper-about .swiper-slide div {
    position: relative;
}

.swiper-about .swiper-slide div svg {
    position: absolute;
    right: 10px;
    bottom: 20px;
}

/* opti-lifehacks */

.opti-lifehacks {
    padding-bottom: 60px;
}

.none {
    display: none;
}
.opti-lifehacks .main-button-next {
    top: 50%;
    position: absolute;
    right: 0;
    z-index: 10;
    transform: translateY(-50%);
    cursor: pointer;
}

.slick-initialized .slick-slide.lifehacks-meat {
    display: flex;
    position: relative;
    min-height: 430px;
}

.lifehacks-meat  {
    transform: translateX(2px);
}

.lifehacks-meat__tabs {
    max-width: 600px;
}

.lifehacks-meat__pagination {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
}

.lifehacks-meat__pagination div,
.opti-lifehacks .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border: 1px solid #fff;
    border-radius: 2px;
    margin: 0 4px;
    box-sizing: border-box;
}

.lifehacks-meat__pagination div.active,
.opti-lifehacks .swiper-pagination-bullet-active {
    background-color: #fff;
}


.lifehacks-meat__content {
    margin-left: auto;
    width: 100%;
    max-width: 480px;
}

.lifehacks-meat__wrapper {
    display: none;
}

.lifehacks-meat__wrapper.active {
    display: block;
}

.lifehacks-meat__content div:first-child {
    margin-bottom: 32px;
}

.lifehacks-meat__content h3 {
    display: flex;
    font-size: 32px;
    font-weight: 500;
    margin: 4px 0 12px;
}

.lifehacks-meat__content h3 svg {
    transform: translateY(5px);
}

.lifehacks-meat__content h4 {
    color: #DD2032;
    font-size: 18px;
    font-weight: 400;
    margin: 0;
}

.lifehacks-meat__content p {
    font-size: 16px;
    line-height: 1.3em;
    margin: 0;
}

.lifehacks-meat__content a {
    margin-top: 16px;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 16px;
    border-bottom: 1px dashed #fff;
    text-decoration: none;
    padding-bottom: 3px;
    max-width: max-content;
}

.lifehacks-meat__content a span {
    margin-left: 5px;
    transition: all .3s;
}

.lifehacks-meat__content a:hover span {
    transform: translateX(3px);
}

.lifehacks-meat .main-fourth__interactive-item {
    position: absolute;
}
  
.lifehacks-meat .main-fourth__interactive-item:not(.main-fourth__interactive-item_disable) {
    cursor: pointer;
}

.main-fourth__interactive-item_disable {
    pointer-events: none;
}
  
.lifehacks-meat .main-fourth__interactive-item svg {
    opacity: 0;
    transition: .3s;
}
  
.lifehacks-meat .main-fourth__interactive-item:hover svg,
.main-fourth__interactive-item.active svg {
    opacity: 1;
}

.lifehacks-meat .main-fourth__interactive-item-text {
    position: absolute;
    z-index: 3;
    font-style: normal;
    font-weight: bold;
    font-size: 15px;
    text-transform: uppercase;
    color: #000;
    font-family: 'DINPro-CondensedMedium';
}
  
.lifehacks-meat .main-fourth__interactive-item-1 {
    top: 46px;
    left: 113px;
}
  
.lifehacks-meat .main-fourth__interactive-item-1 svg{
    width: 67px;
}
  
.lifehacks-meat .main-fourth__interactive-item-2 {
    top: 37px;
    left: 141px;
}
  
.lifehacks-meat .main-fourth__interactive-item-3 {
    top: 36px;
    left: 248px;
}
  
.lifehacks-meat .main-fourth__interactive-item-4 {
    top: 89px;
    left: 249px;
}
  
.lifehacks-meat .main-fourth__interactive-item-5 {
    top: 40px;
    left: 371px;
}
  
.lifehacks-meat .main-fourth__interactive-item-6 {
    top: 123px;
    left: 415px;
}
  
.lifehacks-meat .main-fourth__interactive-item-7 {
    top: 172px;
    left: 257px;
}
  
.lifehacks-meat .main-fourth__interactive-item-8 {
    top: 246px;
    left: 493px;
}
  
.lifehacks-meat .main-fourth__interactive-item-9 {
    top: 241px;
    left: 217px;
}
  
.lifehacks-meat .main-fourth__interactive-item-10 {
    top: 190px;
    left: 175px;
}
  
.lifehacks-meat .main-fourth__interactive-item-11 {
    top: 136px;
    left: 518px;
}
.lifehacks-meat .main-fourth__interactive-item-2 svg {
    width: 110px;
}
.lifehacks-meat .main-fourth__interactive-item-3 svg {
    width: 188px;
    transform: rotate(-1deg);
}
  
.lifehacks-meat .main-fourth__interactive-item-4 svg {
    width: 182px;
    transform: rotate(-1deg);
}
  
.lifehacks-meat .main-fourth__interactive-item-5 svg {
    width: 146px;
}
.lifehacks-meat .main-fourth__interactive-item-6 svg {
    width: 95px;
}
.lifehacks-meat .main-fourth__interactive-item-7 svg {
    width: 222px;
}
  

.lifehacks-meat .main-fourth__interactive-item-1 .main-fourth__interactive-item-text {
    top: 39px;
    left: 22px;
}
  
.lifehacks-meat .main-fourth__interactive-item-2 .main-fourth__interactive-item-text {
    top: 92px;
    left: 30px;
    font-size: 16px;
}
  
.lifehacks-meat .main-fourth__interactive-item-3 .main-fourth__interactive-item-text {
    top: 29px;
    left: 39px;
    font-size: 17px;
}
  
.lifehacks-meat .main-fourth__interactive-item-4 .main-fourth__interactive-item-text {
    top: 30px;
    left: 30px;
    text-align: center;
}
  
.lifehacks-meat .main-fourth__interactive-item-5 .main-fourth__interactive-item-text {
    top: 6px;
    left: 84px
}
  
.lifehacks-meat .main-fourth__interactive-item-6 .main-fourth__interactive-item-text {
    top: 18px;
    left: 28px;
}
  
.lifehacks-meat .main-fourth__interactive-item-7 .main-fourth__interactive-item-text {
    top: 33px;
    left: 125px;
    transform: rotate(15deg);
}
  
.lifehacks-meat .main-fourth__interactive-item-7 .main-fourth__interactive-item-text-2 {
    top: 21px;
    left: 22px;
    transform: rotate(0);
}

.lifehacks-meat .main-fourth__interactive-item-10 .main-fourth__interactive-item-text {
    font-size: 18px;
}
  
.lifehacks-meat .main-fourth__interactive-item-11 .main-fourth__interactive-item-text {
    top: 0;
    left: 0;
}


/* lifehacks-cook-slider */

.lifehacks-cook-slider {
    padding-bottom: 57px;
}

.lifehacks-cook-slider h4 {
    color: #E93323;
    font-size: 18px;
    margin: 0 0 16px 24px;
    height: 40px;
}

.lifehacks-cook-slider img {
    border-radius: 11px;
}

.cursor-pointer {
    cursor: pointer;
}

/* swiper-lifehacks-menu */

.swiper-lifehacks-menu {
    margin-bottom: 32px;
}

.swiper-lifehacks-menu .slick-slide div {
    display: flex;
    align-items: center;
    border-radius: 8px;
    padding: 16px;
    cursor: pointer;
    transition: all .5s;
}

.swiper-lifehacks-menu .slick-current div,
.swiper-lifehacks-menu .slick-slide div:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.swiper-lifehacks-menu .slick-slide img {
    width: 48px;
    height: 48px;
}

.swiper-lifehacks-menu .slick-slide p {
    margin: 0 0 0 8px;
    font-size: 16px;
    font-weight: 500;
}

.lifehacks-cook-slider .swiper-button-next,
.lifehacks-cook-slider .table-button-prev {
    top: 16vw;
}

.lifehacks-cook-slider_slide {
    
    margin: 0 16px;
}

.lifehacks-cook-slider .slick-track {
    
    display: flex;
}

.slick-dots button,
.page-opti .dots-none-pc .slick-dots {
    display: none; 
}

.slick-main__slide .lifehacks-cook-slider .slick-list {
    max-width: 94%;
    margin: auto;
}

.page-opti .slick-dots li {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    border: 1px solid #fff;
    margin: 0 4px;
}

.slick-dots .slick-active {
    background-color: #fff;
}

.page-opti .slick-dots {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}

.arrow-next-meat {
    position: absolute;
    top: 43%;
    right: 1px;
    cursor: pointer;
    z-index: 10;
}

.arrow-prev-meat {
    position: absolute;
    top: 43%;
    left: 1px;
    cursor: pointer;
    z-index: 9999;
}

.arrow-next-menu {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -40px;
    cursor: pointer;
    z-index: 10;
}

.slick-content {
    margin: 0 10px;
}

.slick-disabled,
.swiper-button-disabled {
    opacity: 0.3;
}

/* popup */

.modal{
    position:fixed;
    left:0;
    top:0;
    width:100vw;
    height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    display:none;
    background:#2b2b2beb;
    z-index:10000
}
.modal__x{
    position:absolute;
    right:40px;
    top:20px;
    cursor:pointer
}
.modal_yt-bg{
    position:absolute;
    width:100%;
    height:100%
}
#yt_iframe{
    z-index:100
}

.line-first {
    position: absolute;
    height: 1px;
    width: 100%;
    border-bottom: 1px solid #4A4A4A;
}

.line-first:first-child {
    top: 48.3%;
}

.line-first:nth-child(2) {
    top: 57.2%;
}

.line-first:nth-child(3) {
    top: 67.6%;
}

.line-first:nth-child(4) {
    top: 76.3%;
}

.line-first:nth-child(5) {
    top: 87.1%;
}