#hero-section {position:relative;width:100%;height:100vh;background-color:#000;overflow:hidden;}
#hero-section::before {content:"";position:absolute;top:0;left:0;display:block;width:100%;height:50%;background:linear-gradient(180deg,rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);opacity:0.5;pointer-events:none;z-index:2;}
#hero-section .hero-swiper {height:100%;}
#hero-section .hero-swiper .swiper-wrapper {height:100%;}
#hero-section .hero-swiper .swiper-wrapper .swiper-slide {position:relative;height:100%;background-color:#000;}
#hero-section .hero-swiper .swiper-wrapper .swiper-slide .slide-media {width:100%;height:100%;opacity:0.8;}
#hero-section .hero-swiper .swiper-wrapper .swiper-slide .slide-media video {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
#hero-section .hero-swiper .swiper-wrapper .swiper-slide .slide-text {position:absolute;bottom:25%;left:0;width:100%;color:#fff;font-size:2rem;padding:0 calc((100% - 1400px) / 2);opacity:0;box-sizing:border-box;transform:translateY(1.25rem);transition:0.75s 0.5s;z-index:2;}
#hero-section .hero-swiper .swiper-wrapper .swiper-slide-active .slide-text {opacity:1;transform:translateY(0);}
#hero-section .hero-swiper .hero-pagination {position:absolute;bottom:1.25em;left:0;justify-content:center;align-items:center;gap:0.75rem;width:100%;padding:0 1rem;box-sizing:border-box;z-index:2;}
#hero-section .hero-swiper .hero-pagination .swiper-pagination-bullet {display:block;width:0.75rem;height:0.75rem;margin:0;border-radius:5rem;background-color:#fff;transition:0.3s;opacity:0.4;}
#hero-section .hero-swiper .hero-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2rem;opacity:1;}

.overview {position:relative;height:100vh;padding:0;background-color:#000;}
.overview .title-wrap .title.sub {color:#fff;}
.overview .cont-bg {position:absolute;top:0;left:0;width:100%;height:100%;opacity:0.75;}
.overview .cont-bg video {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.overview .cont-text {position:relative;justify-content:center;height:100%;z-index:1;}
.overview .cont-text .text-change-wrap .texts {color:var(--mono5);font-size:2.75rem;font-weight:700;text-align:center;line-height:1.8;}

.solutions {position:relative;}
.solutions .deco {position:absolute;top:3.75rem;left:-5rem;width:62.5rem;aspect-ratio:1 / 1;background:url(../images/img-bg-circle.png) no-repeat center center / contain;box-sizing:border-box;animation:rotate 10s linear infinite;z-index:-1;}
.solutions .swiper-content {position:relative;}
.solutions .swiper-content .solution-prev,
.solutions .swiper-content .solution-next {position:absolute;top:50%;justify-content:center;align-items:center;width:56px;aspect-ratio:1 / 1;color:var(--color1);font-size:1.5rem;font-weight:800;border-radius:1rem;background-color:var(--color4);transform:translateY(-50%);cursor:pointer;transition:0.3s;z-index:3;}
.solutions .swiper-content .solution-prev:hover,
.solutions .swiper-content .solution-next:hover {color:#fff;background-color:var(--color1);}
.solutions .swiper-content .solution-prev {left:calc(-56px - 1.75rem);}
.solutions .swiper-content .solution-next {right:calc(-56px - 1.75rem);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide {position:relative;aspect-ratio:3 / 4;border-radius:2rem;background-color:#000;overflow:hidden;}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide::before {content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:no-repeat center center / cover;opacity:0.5;}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(1)::before {background-image:url(../images/img-main-solution-1.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(2)::before {background-image:url(../images/img-main-solution-2.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(3)::before {background-image:url(../images/img-main-solution-3.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(4)::before {background-image:url(../images/img-main-solution-4.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(5)::before {background-image:url(../images/img-main-solution-5.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide:nth-child(6)::before {background-image:url(../images/img-main-solution-6.jpg);}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide .inner {position:relative;justify-content:flex-start;gap:7.5rem;width:100%;height:100%;padding:2.5rem;box-sizing:border-box;z-index:1;}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide .inner .num {color:#fff;font-size:2.25rem;font-weight:700;font-family:'Montserrat', sans-serif;}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide .inner .text-wrap .label {display:block;color:#fff;font-size:2.25rem;font-weight:700;margin-bottom:2.5rem;}
.solutions .swiper-content .solution-swiper .swiper-wrapper .swiper-slide .inner .text-wrap .desc {display:block;color:#fff;font-size:1.25rem;font-weight:300;}

.packages {position:relative;}
.packages.dark {background-color:#000;}
.packages.dark::before {content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:url(../images/img-main-package-bg.jpg) no-repeat center center / cover;opacity:0.65;}
.packages .center {position:relative;z-index:1;}
.packages.dark .title-wrap .title {color:#fff;}
.packages .package-list {justify-content:flex-start;gap:1.5rem;width:100%;}
.packages .package-list .item {width:calc((100% / 3) - 1.5rem * 2 / 3);aspect-ratio:9 / 7;border:10px solid;border-radius:2rem;background-color:#ffffff1d;backdrop-filter:blur(12px);box-sizing:border-box;}
.packages.bright .package-list .item.basic {border-color:#15608240;}
.packages.bright .package-list .item.standard {border-color:#4ea72e40;}
.packages.bright .package-list .item.integration {border-color:#e9713240;}
.packages.dark .package-list .item.basic {border-color:var(--pack1);}
.packages.dark .package-list .item.standard {border-color:var(--pack2);}
.packages.dark .package-list .item.integration {border-color:var(--pack3);}
.packages .package-list .item .inner {justify-content:center;gap:2.5rem;width:100%;height:100%;padding:2.5rem;box-sizing:border-box;}
.packages .package-list .item .inner .tag {text-align:center;}
.packages .package-list .item .inner .tag span {display:inline-block;color:#fff;font-size:1.5rem;font-weight:700;text-align:center;line-height:1;padding:1rem 1.75rem;border-radius:1rem;}
.packages .package-list .item.basic .inner .tag span {background-color:var(--pack1);}
.packages .package-list .item.standard .inner .tag span {background-color:var(--pack2);}
.packages .package-list .item.integration .inner .tag span {background-color:var(--pack3);}
.packages .package-list .item .inner .desc {display:block;font-size:1.25rem;font-weight:300;text-align:center;}
.packages.bright .package-list .item .inner .desc {color:var(--mono1);}
.packages.dark .package-list .item .inner .desc {color:#fff;}

.services {position:relative;}
.services .deco {position:absolute;top:8.75rem;left:50%;width:75rem;aspect-ratio:1 / 1;aspect-ratio:1 / 1;background:url(../images/img-bg-circle.png) no-repeat center center / contain;box-sizing:border-box;transform:translateX(-50%);animation:rotate2 10s linear infinite;z-index:-1;}
.services .table-wrap {position:relative;width:100%;overflow-x:auto;z-index:1;}
.services .table-wrap table {width:100%;min-width:700px;margin-top:-3rem;border-collapse:separate;border-spacing:0.75rem 1rem;}
.services .table-wrap table .col1 {width:31%;}
.services .table-wrap table .col2 {width:23%;}
.services .table-wrap table .col3 {width:23%;}
.services .table-wrap table .col4 {width:23%;}
.services .table-wrap table tbody tr.head th {color:#fff;font-size:1.25rem;font-weight:700;text-align:center;padding:1rem 0.5rem;border-radius:1rem;}
.services .table-wrap table tbody tr.head th:nth-child(1) {background-color:var(--mono3);}
.services .table-wrap table tbody tr.head th:nth-child(2) {background-color:var(--pack1);}
.services .table-wrap table tbody tr.head th:nth-child(3) {background-color:var(--pack2);}
.services .table-wrap table tbody tr.head th:nth-child(4) {background-color:var(--pack3);}
.services .table-wrap table tbody tr th {color:var(--mono1);font-size:1.25rem;font-weight:600;text-align:center;padding:1rem 0.5rem;border-radius:1rem;background-color:var(--mono8);}
.services .table-wrap table tbody tr td {text-align:center;padding:1rem 0.5rem;border:1px solid var(--mono7);border-radius:1rem;background-color:#fff;box-sizing:border-box;}
.services .table-wrap table tbody tr td.checked {background:#fff no-repeat center center / 1.5rem;}
.services .table-wrap table tbody tr td.basic.checked {background-image:url(../images/icon-check-pack1.svg);}
.services .table-wrap table tbody tr td.standard.checked {background-image:url(../images/icon-check-pack2.svg);}
.services .table-wrap table tbody tr td.integration.checked {background-image:url(../images/icon-check-pack3.svg);}
.services .table-wrap.mobile {display:none;width:100%;overflow:initial;}
.services .table-wrap.mobile img {display:block;width:100%;}
.services .table-wrap + .caption {color:var(--mono2);font-size:1.25rem;text-align:right;padding:0 0.75rem;margin-top:1.25rem;box-sizing:border-box;}

.contact {padding:0;}
.contact .inner {justify-content:space-between;width:100%;}
.contact .inner .info-wrap {position:relative;width:calc(50% - 1px);height:100vh;background-color:#000;}
.contact .inner .info-wrap::before {content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:url(../images/img-main-contact-bg.jpg) no-repeat center center / cover;opacity:0.65;}
.contact .inner .info-wrap .box {position:relative;justify-content:center;gap:3.75rem;width:100%;height:100%;padding:7.5rem;box-sizing:border-box;z-index:1;}
.contact .inner .info-wrap .box .title {color:#fff;font-size:4.25rem;font-weight:700;line-height:1;}
.contact .inner .info-wrap .box .contact-list {position:relative;padding-top:3.75rem;}
.contact .inner .info-wrap .box .contact-list::before {content:"";position:absolute;top:0;left:-7.5rem;display:block;width:calc(7.5rem + 3.75rem);height:1px;background-color:#fff;}
.contact .inner .info-wrap .box .contact-list li {gap:0.5rem;color:#fff;font-size:1.25rem;font-weight:300;}
.contact .inner .info-wrap .box .contact-list li + li {margin-top:0.75rem;}
/* .contact .inner .info-wrap .box .contact-list li:nth-child(1) .label {width:30px}
.contact .inner .info-wrap .box .contact-list li:nth-child(1) .desc {width:calc(100% - 0.5rem - 30px);} */
.contact .inner .info-wrap .box .contact-list li:nth-child(1) .label {width:50px;}
.contact .inner .info-wrap .box .contact-list li:nth-child(1) .desc {width:calc(100% - 0.5rem - 50px);}
.contact .inner .info-wrap .box .contact-list li:nth-child(2) .label {width:75px;}
.contact .inner .info-wrap .box .contact-list li:nth-child(2) .desc {width:calc(100% - 0.5rem - 75px);}
.contact .inner .form-wrap {width:calc(50% - 1px);padding:7.5rem;box-sizing:border-box;}
.contact .inner .form-wrap .fluentform .ff-el-section-break hr {margin:0;}
.contact .inner .form-wrap .fluentform .ff-el-group {margin-bottom:2.5rem;}
.contact .inner .form-wrap .fluentform .ff-el-input--label {margin-bottom:0.75rem;}
.contact .inner .form-wrap .fluentform .ff-el-input--label label {color:var(--mono1);font-size:1.25rem;font-weight:500;}
.contact .inner .form-wrap .fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after {color:var(--color1);}
.contact .inner .form-wrap .fluentform .ff-el-group.form-horizontal {display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;}
.contact .inner .form-wrap .fluentform .ff-el-group.form-horizontal .ff-el-input--label {width:240px;}
.contact .inner .form-wrap .fluentform .ff-el-group.form-horizontal .ff-el-input--content {width:calc(100% - 240px - 1.25rem);}
.contact .inner .form-wrap .fluentform .ff-name-field-wrapper .ff-el-group {display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;}
.contact .inner .form-wrap .fluentform .ff-name-field-wrapper .ff-el-group .ff-el-input--label {width:240px;padding:0;}
.contact .inner .form-wrap .fluentform .ff-name-field-wrapper .ff-el-group .ff-el-input--content {width:calc(100% - 240px - 1.25rem);margin:0;}
.contact .inner .form-wrap .fluentform .form-terms {margin-bottom:1.25rem;}
.contact .inner .form-wrap .fluentform .form-terms-box {width:100%;height:180px;padding:1.5rem;border:1px solid var(--mono7);border-radius:0.5rem;box-sizing:border-box;overflow-y:auto;}
.contact .inner .form-wrap .fluentform .form-terms-box .form-terms-scroll {color:var(--mono2);font-size:1rem;font-weight:300;}
.contact .inner .form-wrap .fluentform .form-terms-box .form-terms-scroll .sec {margin-top:1.75rem;}
.contact .inner .form-wrap .fluentform .form-terms-box .form-terms-scroll strong {display:block;}
.contact .inner .form-wrap .fluentform .form-terms-box .form-terms-scroll span {display:block;}
.contact .inner .form-wrap .fluentform .form-terms-box .form-terms-scroll span.point {color:var(--color1);}
.contact .inner .form-wrap .fluentform .form-terms-check {margin-bottom:3.75rem;}
.contact .inner .form-wrap .fluentform .form-terms-check .ff-el-form-check-label {display:inline-flex;flex-flow:row wrap;justify-content:flex-start;align-items:center;}
.contact .inner .form-wrap .fluentform .form-terms-check .ff-el-form-check-label .ff_tc_checkbox {width:auto;padding:0 !important;}
.contact .inner .form-wrap .fluentform .form-terms-check .ff-el-form-check-label .ff_t_c {color:var(--mono1);font-size:1rem;font-weight:300;}
.contact .inner .form-wrap .fluentform .form-radio-wrap .ff-el-input--content {display:flex;flex-flow:row wrap;justify-content:flex-start;gap:1.25rem;}
.contact .inner .form-wrap .fluentform .form-radio-wrap .ff-el-input--content .ff-el-form-check {margin:0;}
.contact .inner .form-wrap .fluentform .form-radio-wrap .ff-el-input--content .ff-el-form-check .ff-el-form-check-label {font-size:1.125rem;margin:0;}
.contact .inner .form-wrap .fluentform .ff_submit_btn_wrapper {margin-top:5rem;margin-bottom:0;}
.contact .inner .form-wrap .fluentform .ff_submit_btn_wrapper button {display:inline-block;color:#fff;font-size:1.25rem;font-weight:700;line-height:56px;padding:0 5rem;border-radius:1rem;background-color:var(--mono1);box-sizing:border-box;transition:0.3s;}
.contact .inner .form-wrap .fluentform .ff_submit_btn_wrapper button:hover {background-color:var(--color1);}
.contact .inner .form-wrap .ff-message-success {width:100%;text-align:center;padding:2.5rem;margin-top:0;border:1px solid var(--mono8);box-sizing:border-box;box-shadow:none;}
.contact .inner .form-wrap .ff-message-success .form-submit-result p {color:var(--mono1);font-size:1.5rem;font-weight:500;text-align:center;}

@keyframes rotate {
    from {
      transform:rotate(0deg);
    }
    to {
      transform:rotate(360deg);
    }
}

@keyframes rotate2 {
    from {
      transform:translateX(-50%) rotate(0deg);
    }
    to {
      transform:translateX(-50%) rotate(360deg);
    }
}