/* screen - main */

.main {
  align-items: flex-start;
  background-color: var(--black-2);
  display: flex;
  flex-direction: column;
  height: 15344px;
  overflow: hidden;
  position: relative;
}

.main .main-item {
  height: 1365px;
  margin-right: -6.00px;
  position: relative;
  width: 1926px;
}

.main .flex-row {
  align-items: center;
  display: flex;
  left: -4903px;
  min-width: 6715px;
  position: relative;
  top: -60px;
}

.main .bg {
  height: 1365px;
}

.main .flex-col {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 50px;
  margin-left: 3166px;
  margin-top: 50.0px;
  min-height: 555px;
  width: 475px;
}

.main .snatch-ai-cube {
  color: var(--white);
  font-family: var(--font-family-montserrat);
  font-size: 100px;
  font-weight: 700;
  letter-spacing: -5.00px;
  line-height: normal;
  margin-left: 0.16px;
  min-height: 318px;
  opacity: 0;
  transform: translate(-25px, 0);
  width: 404px;
}

.main .snatch-ai-cube.animate-enter1 {
  animation: animate-enter1-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
  transform: translate(-25px, 0);
}

@keyframes animate-enter1-frames {
  from{opacity: 0;
transform: translate(-25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.main .overlap-group1 {
  height: 187px;
  position: relative;
  width: 475px;
}

.main .x {
  left: 0;
  letter-spacing: 0;
  line-height: 24px;
  position: absolute;
  top: 0;
  width: 475px;
}

.main .button {
  height: 36px;
  left: 0;
  position: absolute;
  top: 151px;
}

.main .overlap-group {
  align-items: flex-start;
  background-color: var(--white);
  border-radius: 28px;
  display: flex;
  height: 36px;
  min-width: 111px;
  padding: 5px 34.0px;
}

.main .text_label {
  height: 24px;
  line-height: 24px;
  min-width: 42px;
  white-space: nowrap;
}

.main .ellipse-1 {
  background-color: var(--white);
  border-radius: 17.98px/18px;
  height: 36px;
  width: 36px;
}

.main .overlap-group2 {
  height: 799px;
  margin-left: 9px;
  margin-top: 261.67px;
  position: relative;
  width: 1145px;
}

.main .aicube_visionbox-1 {
  aspect-ratio: 1.74;
  background-blend-mode: lighten;
  height: 656px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1145px;
}

.main .cost-effective-user {
  height: 162px;
  left: 696px;
  letter-spacing: 0;
  line-height: 24px;
  opacity: 0;
  position: absolute;
  text-align: right;
  top: 637px;
  transform: translate(25px, 0);
  width: 376px;
}

.main .cost-effective-user.animate-enter {
  animation: animate-enter-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
  transform: translate(25px, 0);
}

@keyframes animate-enter-frames {
  from{opacity: 0;
transform: translate(25px, 0);
}
to{opacity: 1;
transform: translate(0,0);
}
}

.main .banner {
  height: 1365px;
  margin-right: -4.00px;
  position: relative;
  width: 1924px;
}

.main .overlap-group3 {
  height: 1098px;
  left: 179px;
  position: relative;
  top: 135px;
  width: 1563px;
}

.main .unsplash3-zh7-x-st-v8uc {
  display: block;
  height: 1098px;
  left: 230px;
  object-fit: cover;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 1102px;
}

.main .unsplash3-zh7-x-st-v8uc.animate-enter2 {
  animation: animate-enter2-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  display: block;
  opacity: 0;
}

@keyframes animate-enter2-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.main .vision-ai {
  left: 0;
  letter-spacing: 0;
  line-height: normal;
  opacity: 0;
  position: absolute;
  text-align: center;
  top: 526px;
  width: 1563px;
}

.main .vision-ai.animate-enter3 {
  animation: animate-enter3-frames 0.20s ease-in-out 0.00s 1 normal forwards;
  opacity: 0;
}

@keyframes animate-enter3-frames {
  from{opacity: 0;
}
to{opacity: 1;
}
}

.main .text-15 {
  color: var(--white);
  font-family: var(--font-family-apple_sd_gothic_neo-medium);
  font-size: var(--font-size-xxxl);
  font-weight: 500;
  left: 4px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  text-align: center;
  top: 419px;
  width: 1559px;
}

.main .flex-row-1 {
  align-items: center;
  display: flex;
  left: 169px;
  min-width: 1569px;
  position: relative;
  top: 15px;
}

.main .sns-link {
  align-items: flex-start;
  display: flex;
  gap: 15px;
  justify-content: center;
  margin-left: 231px;
  margin-top: 1.0px;
  position: relative;
  width: 86px;
}

.main .vector {
  aspect-ratio: 1.37;
  height: 20px;
  left: 2px;
  position: absolute;
  top: 2px;
  width: 28px;
}

.main .overlap-group-2 {
  height: 1065px;
  position: relative;
  width: 1556px;
}

.main .ai {
  left: 519px;
  line-height: 234px;
  top: 650px;
  white-space: nowrap;
}

.main .title {
  left: 0;
  letter-spacing: 0;
  line-height: 234px;
  position: absolute;
  top: 416px;
  width: 952px;
}

.main .rectangle-16 {
  height: 1065px;
  left: 652px;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 783px;
}

.main .text-16 {
  height: 192px;
  left: 1016px;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  text-align: right;
  top: 650px;
  width: 540px;
}

.main .make-yout-cctv-intellignet {
  height: 1365px;
  margin-right: -14.00px;
  position: relative;
  width: 1934px;
}

.main .overlap-group4 {
  height: 1113px;
  left: 183px;
  position: relative;
  top: 126px;
  width: 1556px;
}

.main .text-17 {
  height: 72px;
  left: 1062px;
  letter-spacing: 0;
  line-height: 36px;
  position: absolute;
  text-align: center;
  top: 893px;
}

.main .ui {
  height: 72px;
  left: 106px;
  letter-spacing: 0;
  line-height: 36px;
  position: absolute;
  text-align: center;
  top: 276px;
}

.main .vision-ai-1 {
  height: 36px;
  left: 857px;
  letter-spacing: 0;
  line-height: 36px;
  position: absolute;
  text-align: center;
  top: 60px;
  white-space: nowrap;
}

.main .ai-cube-container {
  background-image: url(../img/container.svg);
  background-position: 50% 50%;
  background-size: cover;
  height: 1365px;
  position: relative;
  width: 1920px;
}

.main .ai-cube {
  left: 681px;
  line-height: normal;
  text-align: right;
  top: 282px;
  width: 1058px;
}

.main .ai-cube-1 {
  height: 280px;
  left: 183px;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  top: 852px;
  width: 762px;
}

.main .overlap-group6 {
  background-image: url(../img/container-1.svg);
  background-position: 50% 50%;
  background-size: cover;
  height: 1365px;
  position: relative;
  width: 1920px;
}

.main .edge-compu-ting {
  color: var(--white);
  font-family: var(--font-family-montserrat);
  font-size: 220px;
  font-weight: 800;
  left: 183px;
  letter-spacing: 0;
  line-height: 234px;
  position: absolute;
  top: 282px;
  width: 1555px;
}

.main .snatch-ai-cube-1 {
  height: 192px;
  left: 946px;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  text-align: right;
  top: 896px;
  width: 793px;
}

.main .overlap-group7 {
  align-items: flex-start;
  background-image: url(../img/container-2.svg);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 102px;
  min-height: 1365px;
  padding: 213px 181px;
  width: 1920px;
}

.main .text-18 {
  align-self: flex-end;
  letter-spacing: 0;
  line-height: normal;
  margin-top: 69px;
  min-height: 600px;
  text-align: right;
  width: 1022px;
}

.main .x70 {
  height: 168px;
  letter-spacing: 0;
  line-height: 56px;
  margin-left: 2px;
  width: 720px;
}

.main .overlap-group9 {
  height: 981px;
  left: 183px;
  position: relative;
  top: 192px;
  width: 1624px;
}

.main .overlap-group8 {
  height: 981px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1624px;
}

.main .rectangle-16-1 {
  background-blend-mode: lighten;
  height: 981px;
  left: 907px;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 717px;
}

.main .text-19 {
  left: 0;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  top: 535px;
  width: 922px;
}

.main .robot-eyes {
  left: 0;
  letter-spacing: 0;
  line-height: 150px;
  position: absolute;
  top: 335px;
  width: 1556px;
}

.main .button-1 {
  height: 36px;
  left: 0;
  position: absolute;
  top: 697px;
}

.main .overlap-group10 {
  align-items: flex-end;
  background-image: url(../img/container-3.png);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  gap: 50px;
  min-height: 1365px;
  padding: 412px 0;
  width: 1922px;
}

.main .robotic-dog {
  align-self: center;
  letter-spacing: 0;
  line-height: 150px;
  margin-top: 143px;
  text-align: right;
  width: 1556px;
}

.main .text-20 {
  letter-spacing: 0;
  line-height: 56px;
  margin-right: 183px;
  min-height: 112px;
  text-align: right;
  width: 922px;
}

.main .button-2 {
  margin-right: 183.15px;
}

.main .drone {
  height: 2645px;
  margin-right: -2.00px;
  position: relative;
  width: 1922px;
}

.main .container {
  height: 2644px;
  left: -4903px;
  object-fit: cover;
  position: absolute;
  top: -60px;
  width: 1920px;
}

.main .overlap-group-1 {
  height: 2645px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1920px;
}

.main .bg-1 {
  height: 2644px;
  left: 0;
  position: absolute;
  top: 0;
}

.main .gradient {
  height: 1005px;
  top: 0;
  transform: rotate(-180.00deg);
}

.main .gradient-1 {
  height: 670px;
  top: 1975px;
}

.main .text_label-1 {
  left: 184px;
  line-height: normal;
  position: absolute;
  top: 251px;
  width: 1552px;
}

.main .button-3 {
  height: 36px;
  left: 887px;
  position: absolute;
  top: 845px;
}

.main .overlap-group1-1 {
  align-items: flex-start;
  background-color: var(--white);
  border-radius: 28px;
  display: flex;
  height: 36px;
  min-width: 111px;
  padding: 5px 33.9px;
}

.main .ellipse-1-1 {
  background-color: var(--white);
  border-radius: 17.96px/18px;
  height: 36px;
  width: 36px;
}

.main .footer {
  background-color: transparent;
  background-image: url(../img/footer.svg);
  background-size: 100% 100%;
  height: 414px;
  position: relative;
  width: 1920px;
}

.main .group-container {
  align-items: center;
  display: flex;
  height: 266px;
  left: 157px;
  min-width: 1602px;
  position: relative;
  top: 81px;
}

.main .text-21 {
  align-self: flex-end;
  letter-spacing: 0;
  line-height: 28px;
  margin-right: 2px;
  min-height: 140px;
  width: 445px;
}

.main .contacts {
  letter-spacing: 0;
  line-height: 28px;
  width: 287px;
}

.main .sns-link-1 {
  align-items: flex-start;
  display: flex;
  gap: 15px;
  justify-content: center;
  margin-top: 49px;
  position: relative;
  width: 86px;
}

.main .ai-1 {
  letter-spacing: 0;
  position: absolute;
}

.main .bg-2 {
  object-fit: cover;
  width: 1920px;
}

.main .button-4 {
  align-items: flex-start;
  cursor: pointer;
  display: flex;
  min-width: 147px;
}

.main .gradient-2 {
  background: linear-gradient(180deg, rgba(3, 3, 3, 0) 0%, rgba(3, 3, 3, 1) 100%);
  left: 0;
  position: absolute;
  width: 1920px;
}

.main .text_label-2 {
  letter-spacing: 0;
  text-align: center;
}
