.fixed_header-shell {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background: white;
  animation: ease-in-out frombottom 0.5s;
  height: -moz-max-content;
  height: max-content;
  box-shadow: 1px 2px 4px 1px rgba(12, 12, 12, 0.3);
  width: 100%;
}

.mainBanner {
  position: relative;
  background-image: url("../images/banner.jpg");
  background: -webkit-image-set(url(../images/banner.webp) 1x, url(../images/banner.webp) 2x, url(../images/banner-min.webp) 3x);
  background: image-set(url(../images/banner.webp) 1x, url(../images/banner.webp) 2x, url(../images/banner-min.webp) 3x);
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  background-size: cover;
  height: 90vh;
  padding-bottom: 40px;
}
.mainBanner .container {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  z-index: 2;
}
.mainBanner h1,
.mainBanner h2 {
  font-size: 2rem;
  line-height: 1.2em;
}
.mainBanner .new-nuka-btn {
  border: 1px solid var(--blue-color);
}
.mainBanner .new-nuka-btn::before {
  background: var(--blue-color);
}
.mainBanner .new-nuka-btn:hover {
  color: var(--blue-color);
}
.mainBanner canvas {
  width: 200px;
  height: 30px;
}
@media screen and (max-width: 1180px) and (min-width: 1081px) {
  .mainBanner h1,
  .mainBanner h2 {
    font-size: 2rem;
  }
}
@media screen and (min-width: 1081px) {
  .mainBanner .container h1,
  .mainBanner .container h2 {
    font-size: 2.8rem;
    width: 60%;
  }
  .mainBanner .container p {
    font-size: 1.4rem;
    width: 50%;
  }
  .mainBanner .bannerNews {
    position: absolute;
    bottom: 20px;
    display: grid;
    grid-template-columns: 28% 50% 15%;
    justify-content: space-between;
    color: var(--black-color);
    background: var(--white-color);
    align-items: center;
  }
  .mainBanner .bannerNews p {
    width: 100%;
    font-size: 1rem;
  }
  .mainBanner .bannerNews .fontst {
    position: relative;
    font-size: 1.6rem;
    font-weight: bold;
    background: var(--orange-color);
    color: var(--white-color);
    padding: 5px 20px;
    height: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
  }
  .mainBanner .bannerNews .fontst::before {
    position: absolute;
    content: "";
    background: var(--white-color);
    width: 200px;
    height: 100%;
    right: -100px;
    top: 0;
    -webkit-transform: rotateZ(-45deg);
    -moz-transform: rotateZ(-45deg);
    -ms-transform: rotateZ(-45deg);
    -o-transform: rotateZ(-45deg);
    transform: rotateZ(60deg);
  }
}
@media screen and (max-width: 1180px) and (min-width: 1081px) {
  .mainBanner h1,
  .mainBanner h2 {
    font-size: 2rem !important;
  }
}
/*********************************************simplyAnimate**************************************************/
.simplyAnimateTop {
  -webkit-animation: simplyRunTop ease-in-out 1.2s forwards;
  -o-animation: simplyRunTop ease-in-out 1.2s forwards;
  animation: simplyRunTop 2s ease-in-out forwards;
}

@keyframes simplyRunTop {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30%);
    -moz-transform: translateY(30%);
    -ms-transform: translateY(30%);
    -o-transform: translateY(30%);
    transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@-webkit-keyframes simplyRunTop {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30%);
    -moz-transform: translateY(30%);
    -ms-transform: translateY(30%);
    -o-transform: translateY(30%);
    transform: translateY(10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
.simplyAnimateRight {
  -webkit-animation: simplyRunRight ease-in-out 1.2s forwards;
  -o-animation: simplyRunRight ease-in-out 1.2s forwards;
  animation: simplyRunRight 2s ease-in-out forwards;
}

@keyframes simplyRunRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20%);
    -moz-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    -o-transform: translateX(-10%);
    transform: translateX(-10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes simplyRunRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20%);
    -moz-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    -o-transform: translateX(-10%);
    transform: translateX(-10%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
.simplyAnimateLeft {
  -webkit-animation: simplyRunLeft ease-in-out 1.2s forwards;
  -o-animation: simplyRunLeft ease-in-out 1.2s forwards;
  animation: simplyRunLeft 2s ease-in-out forwards;
}

@keyframes simplyRunLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(20%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes simplyRunLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(20%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes wordEffectLeft {
  0% {
    /*  opacity: 0;*/
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes wordEffectLeft {
  0% {
    /*        opacity: 0;*/
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}
.wordEffect {
  position: relative;
}
.wordEffect span {
  position: relative;
  display: inline-block;
}
.wordEffect span:nth-child(1) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.05s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.05s forwards;
  animation: wordEffectLeft 0.2s linear 0.05s forwards;
}
.wordEffect span:nth-child(2) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.1s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.1s forwards;
  animation: wordEffectLeft 0.2s linear 0.1s forwards;
}
.wordEffect span:nth-child(3) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.15s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.15s forwards;
  animation: wordEffectLeft 0.2s linear 0.15s forwards;
}
.wordEffect span:nth-child(4) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.2s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.2s forwards;
  animation: wordEffectLeft 0.2s linear 0.2s forwards;
}
.wordEffect span:nth-child(5) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.25s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.25s forwards;
  animation: wordEffectLeft 0.2s linear 0.25s forwards;
}
.wordEffect span:nth-child(6) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.3s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.3s forwards;
  animation: wordEffectLeft 0.2s linear 0.3s forwards;
}
.wordEffect span:nth-child(7) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.35s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.35s forwards;
  animation: wordEffectLeft 0.2s linear 0.35s forwards;
}
.wordEffect span:nth-child(8) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.4s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.4s forwards;
  animation: wordEffectLeft 0.2s linear 0.4s forwards;
}
.wordEffect span:nth-child(9) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.45s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.45s forwards;
  animation: wordEffectLeft 0.2s linear 0.45s forwards;
}
.wordEffect span:nth-child(10) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.5s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.5s forwards;
  animation: wordEffectLeft 0.2s linear 0.5s forwards;
}
.wordEffect span:nth-child(11) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.55s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.55s forwards;
  animation: wordEffectLeft 0.2s linear 0.55s forwards;
}
.wordEffect span:nth-child(12) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.6s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.6s forwards;
  animation: wordEffectLeft 0.2s linear 0.6s forwards;
}
.wordEffect span:nth-child(13) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.65s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.65s forwards;
  animation: wordEffectLeft 0.2s linear 0.65s forwards;
}
.wordEffect span:nth-child(14) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.7s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.7s forwards;
  animation: wordEffectLeft 0.2s linear 0.7s forwards;
}
.wordEffect span:nth-child(15) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.75s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.75s forwards;
  animation: wordEffectLeft 0.2s linear 0.75s forwards;
}
.wordEffect span:nth-child(16) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.8s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.8s forwards;
  animation: wordEffectLeft 0.2s linear 0.8s forwards;
}
.wordEffect span:nth-child(17) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.85s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.85s forwards;
  animation: wordEffectLeft 0.2s linear 0.85s forwards;
}
.wordEffect span:nth-child(18) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.9s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.9s forwards;
  animation: wordEffectLeft 0.2s linear 0.9s forwards;
}
.wordEffect span:nth-child(19) {
  -webkit-animation: wordEffectLeft 0.2s linear 0.95s forwards;
  -o-animation: wordEffectLeft 0.2s linear 0.95s forwards;
  animation: wordEffectLeft 0.2s linear 0.95s forwards;
}
.wordEffect span:nth-child(20) {
  -webkit-animation: wordEffectLeft 0.2s linear 1s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1s forwards;
  animation: wordEffectLeft 0.2s linear 1s forwards;
}
.wordEffect span:nth-child(21) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.05s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.05s forwards;
  animation: wordEffectLeft 0.2s linear 1.05s forwards;
}
.wordEffect span:nth-child(22) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.1s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.1s forwards;
  animation: wordEffectLeft 0.2s linear 1.1s forwards;
}
.wordEffect span:nth-child(23) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.15s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.15s forwards;
  animation: wordEffectLeft 0.2s linear 1.15s forwards;
}
.wordEffect span:nth-child(24) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.2s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.2s forwards;
  animation: wordEffectLeft 0.2s linear 1.2s forwards;
}
.wordEffect span:nth-child(25) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.25s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.25s forwards;
  animation: wordEffectLeft 0.2s linear 1.25s forwards;
}
.wordEffect span:nth-child(26) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.3s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.3s forwards;
  animation: wordEffectLeft 0.2s linear 1.3s forwards;
}
.wordEffect span:nth-child(27) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.35s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.35s forwards;
  animation: wordEffectLeft 0.2s linear 1.35s forwards;
}
.wordEffect span:nth-child(28) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.4s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.4s forwards;
  animation: wordEffectLeft 0.2s linear 1.4s forwards;
}
.wordEffect span:nth-child(29) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.45s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.45s forwards;
  animation: wordEffectLeft 0.2s linear 1.45s forwards;
}
.wordEffect span:nth-child(30) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.5s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.5s forwards;
  animation: wordEffectLeft 0.2s linear 1.5s forwards;
}
.wordEffect span:nth-child(31) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.55s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.55s forwards;
  animation: wordEffectLeft 0.2s linear 1.55s forwards;
}
.wordEffect span:nth-child(32) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.6s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.6s forwards;
  animation: wordEffectLeft 0.2s linear 1.6s forwards;
}
.wordEffect span:nth-child(33) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.65s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.65s forwards;
  animation: wordEffectLeft 0.2s linear 1.65s forwards;
}
.wordEffect span:nth-child(34) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.7s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.7s forwards;
  animation: wordEffectLeft 0.2s linear 1.7s forwards;
}
.wordEffect span:nth-child(35) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.75s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.75s forwards;
  animation: wordEffectLeft 0.2s linear 1.75s forwards;
}
.wordEffect span:nth-child(36) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.8s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.8s forwards;
  animation: wordEffectLeft 0.2s linear 1.8s forwards;
}
.wordEffect span:nth-child(37) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.85s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.85s forwards;
  animation: wordEffectLeft 0.2s linear 1.85s forwards;
}
.wordEffect span:nth-child(38) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.9s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.9s forwards;
  animation: wordEffectLeft 0.2s linear 1.9s forwards;
}
.wordEffect span:nth-child(39) {
  -webkit-animation: wordEffectLeft 0.2s linear 1.95s forwards;
  -o-animation: wordEffectLeft 0.2s linear 1.95s forwards;
  animation: wordEffectLeft 0.2s linear 1.95s forwards;
}
.wordEffect span:nth-child(40) {
  -webkit-animation: wordEffectLeft 0.2s linear 2s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2s forwards;
  animation: wordEffectLeft 0.2s linear 2s forwards;
}
.wordEffect span:nth-child(41) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.05s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.05s forwards;
  animation: wordEffectLeft 0.2s linear 2.05s forwards;
}
.wordEffect span:nth-child(42) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.1s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.1s forwards;
  animation: wordEffectLeft 0.2s linear 2.1s forwards;
}
.wordEffect span:nth-child(43) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.15s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.15s forwards;
  animation: wordEffectLeft 0.2s linear 2.15s forwards;
}
.wordEffect span:nth-child(44) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.2s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.2s forwards;
  animation: wordEffectLeft 0.2s linear 2.2s forwards;
}
.wordEffect span:nth-child(45) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.25s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.25s forwards;
  animation: wordEffectLeft 0.2s linear 2.25s forwards;
}
.wordEffect span:nth-child(46) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.3s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.3s forwards;
  animation: wordEffectLeft 0.2s linear 2.3s forwards;
}
.wordEffect span:nth-child(47) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.35s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.35s forwards;
  animation: wordEffectLeft 0.2s linear 2.35s forwards;
}
.wordEffect span:nth-child(48) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.4s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.4s forwards;
  animation: wordEffectLeft 0.2s linear 2.4s forwards;
}
.wordEffect span:nth-child(49) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.45s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.45s forwards;
  animation: wordEffectLeft 0.2s linear 2.45s forwards;
}
.wordEffect span:nth-child(50) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.5s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.5s forwards;
  animation: wordEffectLeft 0.2s linear 2.5s forwards;
}
.wordEffect span:nth-child(51) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.55s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.55s forwards;
  animation: wordEffectLeft 0.2s linear 2.55s forwards;
}
.wordEffect span:nth-child(52) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.6s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.6s forwards;
  animation: wordEffectLeft 0.2s linear 2.6s forwards;
}
.wordEffect span:nth-child(53) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.65s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.65s forwards;
  animation: wordEffectLeft 0.2s linear 2.65s forwards;
}
.wordEffect span:nth-child(54) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.7s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.7s forwards;
  animation: wordEffectLeft 0.2s linear 2.7s forwards;
}
.wordEffect span:nth-child(55) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.75s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.75s forwards;
  animation: wordEffectLeft 0.2s linear 2.75s forwards;
}
.wordEffect span:nth-child(56) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.8s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.8s forwards;
  animation: wordEffectLeft 0.2s linear 2.8s forwards;
}
.wordEffect span:nth-child(57) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.85s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.85s forwards;
  animation: wordEffectLeft 0.2s linear 2.85s forwards;
}
.wordEffect span:nth-child(58) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.9s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.9s forwards;
  animation: wordEffectLeft 0.2s linear 2.9s forwards;
}
.wordEffect span:nth-child(59) {
  -webkit-animation: wordEffectLeft 0.2s linear 2.95s forwards;
  -o-animation: wordEffectLeft 0.2s linear 2.95s forwards;
  animation: wordEffectLeft 0.2s linear 2.95s forwards;
}
.wordEffect span:nth-child(60) {
  -webkit-animation: wordEffectLeft 0.2s linear 3s forwards;
  -o-animation: wordEffectLeft 0.2s linear 3s forwards;
  animation: wordEffectLeft 0.2s linear 3s forwards;
}

/*********************************************simplyAnimate**************************************************/
.main-content {
  position: relative;
  margin: 120px auto;
}

.main-first {
  position: relative;
  background-color: #f5f6fa;
  padding: 8em 0;
}
.main-first h2 {
  position: relative;
  font-size: 2.6em;
  padding-bottom: 10px;
  line-height: 1.1em;
  margin-bottom: 10px;
  margin-top: 0;
}
.main-first .img {
  position: relative;
}
.main-first .img img {
  vertical-align: top;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 8px;
}
.main-first .newBtn {
  margin-bottom: 0;
}

@media screen and (min-width: 1081px) {
  .main-first .container {
    display: grid;
    grid-template-columns: 40% 56%;
    justify-content: space-between;
  }
  .main-first .container .check-list {
    margin-top: 1.5em;
  }
}
.main-second {
  position: relative;
  padding: 8em 0;
}
.main-second .container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.main-second h2 {
  font-size: 2.6em;
  text-align: center;
  width: 100%;
}

.platforms-list {
  position: relative;
  width: 100%;
}
.platforms-list li {
  position: relative;
  background-color: rgb(245, 246, 250);
  padding: 1.5em;
}
.platforms-list li a {
  color: var(--black-color);
}
.platforms-list li .img {
  position: relative;
  width: 100%;
  aspect-ratio: 400/269;
  overflow: hidden;
  margin-bottom: 1em;
}
.platforms-list li .img img {
  vertical-align: top;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.platforms-list li .title {
  position: relative;
  font-size: 1.1em;
  font-family: "QuicksandSemiBold";
  --bg: url(../images/main-section-2-icon-1.png);
  --width: 1.5em;
}
.platforms-list li .title::before {
  position: absolute;
  content: "";
  background-image: var(--bg);
  background-repeat: no-repeat;
  background-size: contain;
  width: var(--width);
  aspect-ratio: 1;
  right: 0;
  top: 0.5em;
}
.platforms-list li > a {
  color: var(--black-color) !important;
}
.platforms-list li > a:hover {
  color: var(--light-purple-color) !important;
}
@media screen and (min-width: 1081px) {
  .platforms-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, 31%);
    grid-gap: 2em;
  }
  .main-second {
    padding: 120px 0;
  }
  .main-second .container h3 {
    font-size: 2rem;
  }
}

.main-third {
  position: relative;
  padding: 8em 0;
}
.main-third h2 {
  font-size: 2.6em;
  line-height: 1.2em;
}
.main-third::before,
.main-third::after {
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  content: "";
  z-index: 1;
}
.main-third::before {
  left: 0;
  background-color: #f5f6fa;
}
.main-third::after {
  right: 0;
  background-color: #dbd9f1;
}
.main-third .container {
  position: relative;
  z-index: 2;
}
.main-third .check-list > li {
  margin-bottom: 1.6em;
}

.main-fourth,
.main-five {
  position: relative;
  padding: 8em 0;
}
.main-fourth h2,
.main-five h2 {
  position: relative;
  font-size: 2.6em;
  line-height: 1.2em;
}

@media screen and (min-width: 1081px) {
  .main-third .container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1em;
    align-items: center;
  }
  .main-fourth h3,
  .main-five h3 {
    font-size: 2.4rem;
  }
}

.main-fourth {
  text-align: center;
}

.main-five {
  background-color: #dbd8f0;
}
.main-five h2 {
  text-align: center;
}
.main-five .simply-list {
  --child-width: 31%;
  font-family: "QuicksandRegular";
}
.main-five .simply-list .title {
  font-family: "QuicksandSemiBold";
  font-size: 1.2em;
}
.main-five .simply-list .img {
  width: 14em;
}
.main-five .simply-list > li {
  z-index: 2;
}
.main-five .simply-list::before,
.main-five .simply-list::after {
  position: absolute;
  content: "";
  background-image: url(../images/main-section-5-bg.svg);
  background-size: 100%;
  width: 120%;
  height: 20em;
  background-repeat: no-repeat;
  z-index: 1;
  left: -10%;
}
.main-five .simply-list::after {
  bottom: 4em;
}

.simply-list {
  position: relative;
  font-family: "QuicksandMedium";
  margin: 2em 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, var(--child-width));
  justify-content: space-between;
  grid-gap: 1em;
}
.simply-list > li {
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  --scale: 1;
  --translateY: 0;
}
.simply-list > li:hover {
  --translateY: -0.3em;
}
.simply-list > li a {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: all ease-in-out 0.4s;
  color: var(--black-color);
}
.simply-list > li a:hover {
  color: var(--light-purple-color);
}
.simply-list > li .img {
  position: relative;
  width: 4em;
  aspect-ratio: 1;
  overflow: hidden;
}
.simply-list > li .img img {
  vertical-align: top;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  transition: all ease-in-out 0.4s;
  transform: scale3d(var(--scale), var(--scale), var(--scale));
}
.simply-list > li .content {
  position: relative;
  transition: all ease-in-out 0.4s;
  transform: translateY(var(--translateY));
}
.simply-list > li .title {
  font-family: "QuicksandSemiBold";
}

@media screen and (min-width: 1081px) {
  .simply-list {
    --child-width: 23%;
  }
}
@media screen and (max-width: 1080px) {
  .simply-list {
    --child-width: 47%;
  }
}

.main-six {
  background-color: #f5f6fa;
}
.main-six,
.main-seven {
  position: relative;
  padding-top: 8em;
  padding-bottom: 4em;
}
.main-six h2,
.main-seven h2 {
  position: relative;
  font-size: 2.6em;
  line-height: 1.2em;
  text-align: center;
}
.main-six .container > p,
.main-seven .container > p {
  text-align: center;
}
.main-six .container h4,
.main-seven .container h4 {
  font-size: 1.4rem;
}
.main-six .container .newBtn,
.main-seven .container .newBtn {
  display: flex;
  align-items: center;
  font-size: 1rem;
  padding: 5px 20px;
}
.main-six .container .newBtn::before,
.main-seven .container .newBtn::before {
  background: var(--purple-color);
}
.main-seven {
  padding-top: 4em;
  background-color: rgba(244, 244, 244, 1);
}
.main-seven .simply-list {
  margin-top: 0;
  margin-bottom: 4em;
}
.main-seven .simply-list .img {
  width: auto;
  aspect-ratio: unset;
}
.main-picture-list {
  position: relative;
  --child-width: 23%;
}
.main-picture-list > li {
  position: relative;
  --translateY: -4em;
  --box-shadow-color: rgba(21, 21, 21, 0.1);
}
.main-picture-list > li:hover {
  --translateY: -4.2em;
  --box-shadow-color: rgba(21, 21, 21, 0.2);
}
.main-picture-list > li a {
  position: relative;
  transition: all ease-in-out 0.2s;
  color: var(--black-color);
  height: 100%;
  display: flex;
  flex-direction: column;
}
.main-picture-list > li a:hover {
  color: var(--purple-color);
}
.main-picture-list > li .title {
  position: relative;
  font-family: "QuicksandSemiBold";
  font-size: 1.2em;
  /*  background-color: var(--white-color);
  text-align: center;
  padding: 1em;
  width: 80%;
  transition: all ease-in-out 0.4s;
  box-shadow: 1px 0px 20px 10px var(--box-shadow-color);
  height: 5.2em;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1em;
  border-radius: 3px; */
}
.main-picture-list > li .btn {
  color: var(--light-purple-color);
  position: absolute;
  bottom: 1em;
}
.main-picture-list > li .content {
  padding-bottom: 3em;
  height: 100%;
}

.main-contact {
  position: relative;
  padding: 8em 0;
}
.main-contact h2 {
  position: relative;
  font-size: 2.6em;
  line-height: 1.2em;
  text-align: center;
}

@media screen and (min-width: 1081px) {
  .main-six .container h3 {
    font-size: 2.4rem;
  }
  .main-picture-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--child-width));
    justify-content: space-between;
  }
  .main-contact .row-layout {
    margin: 2em 0;
    display: grid;
    grid-template-columns: 58% 40%;
    justify-content: space-between;
    grid-gap: 2em;
  }
  .main-contact .row-layout iframe {
    height: 100%;
  }
}

.main-contact .inquiry-form input,
.main-contact .inquiry-form textarea {
  background-color: rgba(121, 121, 121, 0.1);
}
.main-eight .horizontal-scrolling {
  padding-bottom: 1em;
}
.main-eight .horizontal-scrolling .scrolling-oprate {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  left: calc(100% + 1em);
  height: 100%;
}
.main-eight .horizontal-scrolling .scrolling-oprate > li {
  position: relative;
  width: 2em;
  height: auto;
  aspect-ratio: 1;
  margin: 0;
  z-index: 10;
  display: block;
  border: none;
  background: var(--white-color);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.main-eight .horizontal-scrolling .scrolling-oprate > li::before {
  position: absolute;
  content: "";
  width: calc(100% - 8px);
  aspect-ratio: 1;
  border-radius: 50%;
  z-index: -1;
  background: var(--white-color);
  border: 1px solid rgba(105, 89, 161, 0.3);
}
.main-eight .horizontal-scrolling .scrolling-oprate > li.current::before {
  border-color: var(--purple-color);
}
.main-eight .horizontal-scrolling .scrolling-oprate > li.current::after {
  position: absolute;
  background: var(--purple-color);
  content: "";
  width: calc(100% - 16px);
  aspect-ratio: 1;
  border-radius: 50%;
  z-index: -1;
}
.main-eight .horizontal-scrolling .scrolling-oprate::before {
  position: absolute;
  content: "";
  left: 50%;
  height: 100%;
  width: 1px;
  background: rgba(105, 89, 161, 0.3);
  z-index: 1;
}

.main-eight-container {
  width: 42em;
  max-width: 100%;
}