#section_LogicSeptTitleHeader_1 {   display: flex;   justify-content: center;   align-items: center;   padding: 15px 0;   font-family: "Poppins", sans-serif; }   #section_LogicSeptTitleHeader_1 .container {     display: flex;     justify-content: space-between;     align-items: center;     width: 100%;     max-width: 1170px;     padding: 0 50px;     box-sizing: border-box;     background-color: #f5f6f7;     position: relative;     height: 70px; }   #section_LogicSeptTitleHeader_1 .container .title {     font-size: clamp(1.5rem, 3.5vw, 2rem);     line-height: 1.35;     color: #707070;     margin: 0;     padding: 10px 0;     z-index: 2;     position: relative; }   #section_LogicSeptTitleHeader_1 .container .title::before {     content: '';     position: absolute;     width: 100%;     height: 100%;     z-index: -1;     top: 0;     left: 0;     background-color: transparent;     backdrop-filter: blur(8px);     transform: skewX(20deg); }   #section_LogicSeptTitleHeader_1 .container .img_container img {     width: 350px;     height: 70px;     aspect-ratio: 350 / 70;     display: block;     clip-path: polygon(0% 0%, 93% 0%, 100% 100%, 7% 100%);     transform: scale(1.2);     box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);     object-fit: cover;     object-position: center; }   #section_LogicSeptTitleHeader_1 .container .img_container {     max-width: 350px;     width: 100%;     height: 70px;     position: absolute;     right: 100px; }   #section_LogicSeptTitleHeader_1 .container .img_container::before {     content: '';     position: absolute;     width: calc(100% + 70px);     height: 100%;     transform: skewX(20deg);     left: -30px;     background-color: transparent;     box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); }   @media only screen and (max-width: 767px) {     #section_LogicSeptTitleHeader_1 .container {       height: 50px; }     #section_LogicSeptTitleHeader_1 .container .img_container img {       max-width: 250px;       height: 50px;       aspect-ratio: 250 / 50;       width: 100%; }     #section_LogicSeptTitleHeader_1 .container .img_container {       max-width: 250px;       height: 50px;       width: 100%;       right: 50px; }     #section_LogicSeptTitleHeader_1 .container {       padding: 0 20px; }     #section_LogicSeptTitleHeader_1 .container .img_container::before {       width: calc(100% + 50px);       height: 100%;       transform: skewX(20deg);       left: -20px;       background-color: transparent;       box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); } }  @media only screen and (max-width: 767px) and (max-width: 480px) {   #section_LogicSeptTitleHeader_1 .container .img_container {     display: none; } }  #section_LogicSeptCatalog_2 {   background-color: #fff;   display: flex;   justify-content: center;   align-items: center;   font-family: "Poppins", sans-serif; }   #section_LogicSeptCatalog_2 .container {     display: flex;     flex-direction: column;     justify-content: center;     align-items: center;     width: 100%;     padding-bottom: 20px;     max-width: 1090px;     min-height: 200px;     user-select: none; }   #section_LogicSeptCatalog_2 .container .modal {     display: none;     justify-content: flex-start;     flex-direction: column;     align-items: center;     position: fixed;     z-index: 1;     left: 0;     top: 0;     width: 100%;     height: 100%;     overflow: auto;     background-color: #bfb9bd7d;     backdrop-filter: blur(8px);     user-select: none;     z-index: 10; }   #section_LogicSeptCatalog_2 .container .modal .modal-content {     margin: auto;     display: block;     width: 100%;     height: 100%;     object-position: center;     object-fit: cover; }   #section_LogicSeptCatalog_2 .container .modal .close {     position: absolute;     top: 5px;     right: 20px;     color: #1C2D4E;     font-size: 40px;     font-weight: bold;     transition: 0.3s;     z-index: 2; }   #section_LogicSeptCatalog_2 .container .modal .close:hover {     color: #bbb;     text-decoration: none;     cursor: pointer; }   #section_LogicSeptCatalog_2 .container .slider .slides .slide img {     width: 100%;     max-width: 600px;     height: auto;     aspect-ratio: 600 / 800;     z-index: 2;     object-position: center;     object-fit: cover; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg {     display: flex;     flex-direction: row;     justify-content: center;     align-items: center;     position: relative;     width: 100%;     overflow: hidden; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .slides_bg {     display: flex;     transition: transform 0.5s ease-in-out;     padding: 50px; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .prev_bg,   #section_LogicSeptCatalog_2 .container .modal .slider_bg .next_bg {     position: absolute;     border-radius: 100%;     background-color: transparent;     width: 44px;     height: 44px;     font-size: 34px;     top: 50%;     transform: translateY(-50%);     color: #1C2D4E;     border: none;     cursor: pointer;     z-index: 1001; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .prev_bg {     left: 0; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .next_bg {     right: 0; }   #section_LogicSeptCatalog_2 .container .slider {     position: relative;     max-width: 1090px;     width: 100%;     overflow: hidden; }   #section_LogicSeptCatalog_2 .container .slider .slides {     display: flex;     width: 100%;     transition: all .48s ease-in-out; }   #section_LogicSeptCatalog_2 .container .slider .slides .slide {     width: calc(100% - 20px);     padding: 40px 0;     box-sizing: border-box;     margin: 10px;     display: flex;     flex-direction: column;     justify-content: space-between;     align-items: center;     flex-shrink: 0;     overflow: hidden;     height: auto;     position: relative;     z-index: 2;     cursor: pointer; }   #section_LogicSeptCatalog_2 .container .slider .slides .slide::before {     content: '';     position: absolute;     top: 5px;     height: 36px;     width: 100%;     background-color: #dbebec; }   #section_LogicSeptCatalog_2 .container .slider .slides .slide::after {     content: '';     position: absolute;     bottom: 0;     height: 40px;     width: 100%;     background-color: #dbebec; }   #section_LogicSeptCatalog_2 .container .slider .prev,   #section_LogicSeptCatalog_2 .container .slider .next {     position: absolute;     width: 18px;     height: 18px;     font-size: 18px;     top: 31px;     background-color: transparent;     transform: translateY(-50%);     color: #1C2D4E;     border: none;     cursor: pointer;     z-index: 1001; }   #section_LogicSeptCatalog_2 .container .slider .prev::before,   #section_LogicSeptCatalog_2 .container .slider .next::before {     content: '';     position: absolute;     left: -11px;     right: -11px;     bottom: -11px;     top: -11px; }   #section_LogicSeptCatalog_2 .container .slider .prev {     right: 100px; }   #section_LogicSeptCatalog_2 .container .slider .next {     right: 40px; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .dot_container {     position: absolute;     bottom: 0;     width: 100%;     height: 30px;     display: flex;     flex-wrap: wrap;     justify-content: center;     align-items: center;     color: #fff;     gap: 5px; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .dot_container .dot {     width: 10px;     height: 10px;     border-radius: 50%;     background-color: #808080;     cursor: pointer; }   #section_LogicSeptCatalog_2 .container .modal .slider_bg .dot_container .dot.active {     background-color: #fff; }   #section_LogicSeptCatalog_2 .container .slider .slide-counter {     position: absolute;     top: 20px;     right: 60px;     color: #1C2D4E;     font-size: 16px; }   #section_LogicSeptCatalog_2 .container .slider .bottom {     position: absolute;     bottom: 18px;     display: flex;     align-items: center;     justify-content: space-between;     align-self: center;     box-sizing: border-box;     width: 100%;     padding: 0 50px; }   #section_LogicSeptCatalog_2 .container .slider .bottom .name {     font-size: 1rem;     font-weight: 1000;     color: #1C2D4E; }   #section_LogicSeptCatalog_2 .container .slider .bottom .openSlideZoom {     cursor: pointer;     display: inline-flex;     justify-content: center;     align-items: center;     width: 21.7397px;     height: 21.8597px; }   #section_LogicSeptCatalog_2 .container .btn {     text-decoration: none;     border-radius: 30px;     border: 1px solid #1C2D4E;     color: #1C2D4E;     background-color: transparent;     min-width: 250px;     max-width: 350px;     font-size: clamp(0.875rem, 2vw, 1.125rem);     line-height: 1.6;     padding: 5px 10px;     box-sizing: border-box;     display: flex;     align-items: center;     justify-content: center;     text-align: center;     position: relative;     transition: all .3s ease-in-out; }   #section_LogicSeptCatalog_2 .container .btn::before {     content: '';     position: absolute;     top: -10px;     bottom: -10px;     left: 0;     right: 0; }   #section_LogicSeptCatalog_2 .container .btn:hover {     color: #fff;     background-color: #1C2D4E;     transition: all .3s ease-in-out; } 
