*{padding: 0; margin: 0; box-sizing: border-box; font-family: "SCoreDream";}

a{text-decoration: none;}

li{list-style: none;}

body{overflow-x: hidden;}

.container{width: 1180px; margin: auto; overflow: hidden;}

.brM{display: none;}

section{background-position: center;}

/* .section1 */
.section1{padding:245px 0 39px; background: url(../img/aiEng/s1-bg.png) no-repeat; background-size: cover;}

.section1 .section1_tit{text-align: center; font-size: 30px; letter-spacing: -.75px; color: #fff; line-height: 1.8; font-weight: 700;}

.section1 .section1_img{margin: 16px auto 0px; width: 530px;}

.section1 .section1_img img{width: 100%;}

.section1 h2{padding: 27px 24px 32px 26px; margin: auto; text-align: center; font-weight: 900; font-size: 80px; color: #b629ff; line-height: 0.88;}

.section1 .section1_text p{font-size: 28px; font-weight: 300; color: #fff; line-height: 1.5; letter-spacing: -0.7px; text-align: center;}

.section1 .section1_text p span{font-weight: 700;}
.section1 .section1_text p span.spanM{font-weight: 300;}

/* // .section1 */

/* .section2 */

.section2{padding: 32px 0 43px; background: url(../img/aiEng/s2-bg.jpg) no-repeat; background-size: cover;}

.section2 h2{font-size: 32.5px; font-weight: 300; color: #fff; letter-spacing: -.81px; line-height: 2.06; text-align: center; padding-bottom: 0;}


.m_ai_loader{
	margin-left: 40px;
  display: inline;
  vertical-align: middle;
}
.ai_load{
	display: inline-block;
	width: 27px;
	height: 27px;
	background: url('../img/aiEng/sec2_ico.png') no-repeat center / 100%;
	vertical-align: top;
	position: relative;
  top: 16px;
}
.ai_loader{
	width: 3px;
	height: 3px;
	border-radius: 100%;
	background: #fff ;
	animation: loader1 30s infinite linear;
	position: absolute;	
	top: 12px;
	left:12px;
} 
.ai_loader::before,.ai_loader::after{
	content: '';
	border-radius: 100%;
	position: absolute;
}
.ai_loader::before{
	width: 6px;
	height: 20px;
	top: -8.5px;
	left: -2px;
	animation: loader2 .8s linear infinite;
}
.ai_loader::after{
	width: 20px;
	height: 6px;
	top: -2px;
	left: -8.5px;
	animation: loader2 1.2s linear infinite;
}
@keyframes loader1 {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
@keyframes loader2 {
	0% {
		box-shadow: 1px -1px 0 0.5px  #fff;
	}
	25% {
		box-shadow: 1px 1px 0 0.5px  #fff;
	}
	50% {
		box-shadow: -1px 1px 0 0.5px  #fff;
	}
	75% {
		box-shadow: -1px -1px 0 0.5px  #fff;
	}
	100% {
		box-shadow: 1px -1px 0 0.5px  #fff;
	}
}
/* 2022-02-23 수정 */
.m_ai_loader span{
	display: inline-block;
	color: #2de3e6;
	font-family: 'NanumSquareRoundB', sans-serif;
	font-size: 18px;
	letter-spacing: normal;
	margin:2px 0 0 14px;/*2022-02-24 ai텍스트-모션 사이간격수정*/
}

 .m_ai_loader span{
 	color:#005771;
}

.section2 .section2_box{display: flex; justify-content: space-between;}

.section2 .section2_box .section2_boxWrap{ position: relative;}

.section2 .section2_box .section2_boxWrap .section2_Tbox{width: 238px; height: 151px; background: url(../img/aiEng/box@2x.png) no-repeat; background-size: 314px; background-position: center; padding-top: 38px; text-transform: uppercase;}

.section2 .section2_box .section2_boxWrap .section2_Tbox p{font-size: 24px; font-weight: 700; line-height: 1.5; color: #fff; text-align: center;}

.section2 .section2_box .section2_boxWrap .section2_Tbox p br{display: block;}

.section2 .section2_box .section2_boxWrap .section2_arr{width: 112px; position: absolute; top: 8px; left: 195px;}

.section2 .section2_box .section2_boxWrap .section2_arr img{width: 100%;}

/*  */
.section2_Tbox1{opacity: 0; transform: translateX(-50%);}
.section2_arr1{opacity: 0; transform: translateX(-50%);}
.section2_Tbox2{opacity: 0; transform: translateX(-50%);}
.section2_arr2{opacity: 0; transform: translateX(-50%);}
.section2_Tbox3{opacity: 0; transform: translateX(-50%);}
.section2_arr3{opacity: 0; transform: translateX(-50%);}
.section2_Tbox4{opacity: 0; transform: translateX(-50%);}

.section2.on .section2_Tbox1{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s;}
.section2.on .section2_arr1{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: .5s;}
.section2.on .section2_Tbox2{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: 1s;}
.section2.on .section2_arr2{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: 1.5s;}
.section2.on .section2_Tbox3{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: 2s;}
.section2.on .section2_arr3{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: 2.5s;}
.section2.on .section2_Tbox4{opacity: 1; transform: translateX(0); transition-property: opacity, transform; transition-duration: .5s; transition-delay: 3s;}
/* .section2 .section2_box .section2_boxWrap .section2_Tbox img{width: 100%;} */

/* //.section2 */

/* .section3 */

.section3{/* padding-top: 39px;  */padding: 39px 0 0; background: url(../img/aiEng/s3-bg.png) no-repeat; background-size: cover;}

.section3 .container{padding-bottom: 142px;}

.section3 .ai_st_box{display: flex; justify-content: space-between; position: relative;}

.section3 .ai_st_box .ai_st{width: 570PX; height: 539px; position: relative;}
.section3 .ai_st_box .ai_st_m{display: none;}


.section3 .ai_st_box .ai_st_B{background: url(../img/aiEng/ai_st_B.png); background-size: cover; z-index: 2;}
.section3 .ai_st_box .ai_st_A{background: url(../img/aiEng/ai_st_A.png); background-size: cover; z-index: 0;}

.section3 .ai_st_arr{width: 205px; position: absolute; left: 439px; top: 164px; z-index: 1; animation: arrAni2 0.5s infinite;}

@keyframes arrAni2 {
  0%{
    transform: translate(0, 0);
  }
  50%{
    transform: translate(8%, 0);
  }
  100%{
    transform: translate(0, 0);
  }
}

.section3 .ai_st_arr img{width: 100%;}

.section3 h2{font-size: 36px; font-weight: bold; letter-spacing: -3px; line-height: 1.33; color: #fff; text-align: center; margin-top: 139px;}

.section3 h2~p{font-size: 60px; font-weight: bold; text-align: center; letter-spacing: -.9px; color: #943eff; margin-bottom: 80px;}

    /* section3 스와이퍼 */

    .swiper01 {
        width: 100%;
        position: relative;
      }

      .swiper-slide {
        text-align: center;
        font-size: 18px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

/* //.section3 */

/* .section4 */

.section4{padding-top: 193px; position: relative; background: url(../img/aiEng/s4-bg.png) no-repeat; background-size: cover;}

.section4 .container{padding-bottom: 293px;}

.section4 h2{font-size: 36px; font-weight: bold; line-height: 1.33; letter-spacing: -.9px; text-align: center; color: #fff;}

.section4 h2+p{font-size: 60px; font-weight: bold; text-align: center; letter-spacing: -3px; color: #943eff; margin-bottom: 64px;}

.section4 .container .swiperBox{position: relative;}

/* 스와이퍼 공통 */

.swiper{overflow: visible !important}

.swiper-pagination{ bottom: -30px !important; width: 100% !important;}

.swiper-pagination .swiper-pagination-bullet{
  width: 12px;
  height: 12px;
  background: #838383;
  transition: 0.3s;
  left: 0 !important;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{
  transform: scale(.66) !important;
}

.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  width: 37px;
  background: #fff;
  border-radius: 6px;
}


.swiperBox{margin-bottom: 63px;}
.swiperBox:last-child{margin-bottom: 0px;}

.swiperBox .step{position: absolute; z-index: 2; top: 66px; width: 100%;}

.swiperBox .step h3{text-align: center; font-size: 40px; font-weight: 900; color: #fff; line-height: 1.75;}

.swiperBox .step h3 span{color: #943eff;}
.swiperBox.SB2 .step h3 span{color: #c118f4;}
.swiperBox.SB3 .step h3 span{color: #366bcd;}

.swiperBox .step h4{font-size: 24px; font-weight: 400; text-align: center; color: #fff; line-height: 2.5; letter-spacing: -1.2px; margin-bottom: 28px;}

.swiperBox .step ul{display: flex; justify-content: center;}

.swiperBox .step ul li{width: 100%;}

.swiperBox .step ul li a{display: block; width: 100%; position: relative;}

.swiperBox .step ul li a img{width: 100%;}

.swiperBox .step ul li a .imgColor{display: none;}

.swiperBox .step ul li .swiper2-a.on .imgBlack{display: none;}
.swiperBox .step ul li .swiper2-a.on .imgColor{display: inline-block;}

.swiperBox .step ul li .swiper3-a.on .imgBlack{display: none;}
.swiperBox .step ul li .swiper3-a.on .imgColor{display: inline-block;}

.swiperBox .step ul li .swiper4-a.on .imgBlack{display: none;}
.swiperBox .step ul li .swiper4-a.on .imgColor{display: inline-block;}

.swiperBox .step ul li a span{display: block; width: 100%; text-align: center; font-size: 30px; font-weight: bold; letter-spacing: -1.5px; color:#fff; text-transform: uppercase; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); padding-bottom: 5px;}

.swiperBox .step ul li a.step01{transform: translateX(25px);}
.swiperBox .step ul li a.step02{transform: translateX(-16px);}

.step2-01{transform: translateX(1.8vw);}
.step2-03{transform: translateX(-1.8vw);}

/*  */

    /* section4-1 스와이퍼 */
    .swiper02 {
        width: 100%;
        /* height: 1391px; */
        /* height: 1389px;  */border: 2px solid #5011a6; border-radius: 60px; background-image: linear-gradient(to top, #23014e, #170531);
        overflow: unset;
      }

      .swiper02 .swiper-slide {
        text-align: center;
        font-size: 18px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
      
      .swiper-slide .arr{position: absolute; width: 45%; bottom: 4%; z-index: -1;}

      .swiper-slide .arr img{animation: arrAni 0.5s infinite;}
      @keyframes arrAni{
        0%{
          transform: translate(0, 0);
        }
        50%{
          transform: translate(0, -8%);
        }
        100%{
          transform: translate(0, 0);
        }
      }

    /*  */

    /* section4-2 스와이퍼 */
    .swiper03 {
        width: 100%;
        /* height: 1391px; */
        height: 1389px; border: 2px solid #600d59; border-radius: 60px; background-image: linear-gradient(to right, #070d2c, #370b39);
      }

      .swiper03 .swiper-slide {
        text-align: center;
        font-size: 18px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    /*  */

    /* section4-3 스와이퍼 */
    .swiper04 {
        width: 100%;
        /* height: 1391px; */
        height: 1389px; border: 2px solid #11428d; border-radius: 60px; background-image: linear-gradient(to top, #0f2957, #07142e);
      }

      .swiper04 .swiper-slide {
        text-align: center;
        font-size: 18px;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

/* //.section4 */

/* .section5 */

.section5{height: 535px;background: url(../img/aiEng/s5-bg.png) no-repeat; background-size: cover;}

.section5 .container{display: flex; justify-content: center; align-items: center; height: 100%;}

.section5 .container>*{text-align: center;}

.section5 .container .desc{font-size: 36px; color: #fff; font-weight: 700;}

.section5 .container h2{font-size: 50px; color: #fff; margin: 10px 0; font-weight: 700;}

.section5 .container h2 span{color: #943eff;}

/* //.section5 */

.pImg{display: block !important;}
.mImg{display: none !important;}

@media screen and (max-width:897px) {
  .pImg{display: none !important;}
  .mImg{display: block !important;}
  .brM{display: block;}
  
.spanM{display: none;}

.container{width: 100%;}

section{padding: 0 4%;}

.wrap{overflow-x: hidden;}

.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 36px;}

.swiper-slide{padding-top: 11vw;}
.swiper01 .swiper-slide{padding-top: 0;}

/* .section1 */
.section1{padding: 29.7vw 0 4.3vw;}

.section1 .section1_tit{font-size: 5.3vw;}

.section1 .section1_img{width: 76vw; margin: 2.7vw auto 0;}

.section1 h2{font-size: 11vw; padding: 3vw 2.6vw 3.1vw 2.8vw;}

.section1 .section1_text p{font-size: 3.2vw;}

/* //.section1 */

/* .section2 */
.section2{padding: 3.5vw 0 4.7vw;}

.section2 h2{font-size: 3.4vw; margin-bottom: 0; padding-bottom: 0;}


.m_ai_loader{
  margin-left: 0px;
  margin-right: .6vw;
  display: inline;
  vertical-align: middle;
}
.ai_load{
	display: inline-block;
	width: 3.4vw;
	height: 3.4vw;
	background: url('../img/aiEng/sec2_ico.png') no-repeat center / 100%;
	vertical-align: top;
	position: relative;
    top: 1.5vw;
}
.ai_loader{
	width: 3px;
	height: 3px;
	border-radius: 100%;
	background: #fff ;
	animation: loader1 30s infinite linear;
	position: absolute;	
	top: 1.3vw;
	left:1.2vw;
} 
.ai_loader::before,.ai_loader::after{
	content: '';
	border-radius: 100%;
	position: absolute;
}
.ai_loader::before{
    width: 0.6vw;
    height: 2.2vw;
    top: -0.9vw;
    left: -0.2vw;
      animation: loader2 .8s linear infinite;
  }
  .ai_loader::after{
      width: 2.2vw;
    height: 0.6vw;
    top: -0.2vw;
    left: -0.9vw;
      animation: loader2 1.2s linear infinite;
}

.section2 .section2_box{margin-right: 2vw;}

.section2 .section2_box .section2_boxWrap{width: 25%;}

.section2 .section2_box .section2_boxWrap .section2_Tbox{width: 100%; height: 24vw; margin: auto; background: url(../img/aiEng/box_M.png) no-repeat; background-size: cover; padding-top: 1.2vw; display: flex; justify-content: center; align-items: center; padding: 4.2vw 0 0 1.7vw ;}

.section2 .section2_box .section2_boxWrap .section2_Tbox p{font-size: 2.6vw;}

.section2 .section2_box .section2_boxWrap .section2_arr{left: 50%; z-index: 1; width: 12.4vw; top: 6.7vw;}
.section2.on .section2_box .section2_boxWrap .section2_arr1{left: 64%;}
.section2.on .section2_box .section2_boxWrap .section2_arr2{left: 64%;}
.section2.on .section2_box .section2_boxWrap .section2_arr3{left: 64%;}

/* //.section2 */

/* .section3 */

.section3{padding: 4.4vw 4% 0;}

.section3 .container{padding-bottom: 15vw;}

.section3 .ai_st_box{flex-direction: column; align-items: center;}

.section3 .ai_st_box .ai_st{display: none;}
.section3 .ai_st_arr{display: none;}
.section3 .ai_st_box .ai_st_m{display: block; position: relative;}

.section3 .ai_st_box .ai_st_B_m{margin-bottom: 19.3vw; z-index: 1; position: relative;}
.section3 .ai_st_box .ai_st_A_m{ z-index: 1; position: relative;}

.section3 .ai_st_box .ai_st_m img{width: 100%;}

.section3 .ai_st_arr_M{display: block; width: 36%; position: absolute; left: 50%; top:44%; z-index: 0; transform: translate(-50%, -50%) rotate(90deg); animation: arrAniM 0.5s infinite;}

@keyframes arrAniM {
  0%{
    top: 44%;
  }
  50%{
    top: 45%;
  }
  100%{
    top: 44%;
  }
}

.section3 .ai_st_arr_M img{width: 100%;}

.section3 h2{font-size: 4.8vw; margin-top: 15.47vw; letter-spacing: -0.2vw;}

.section3 h2+p{font-size: 6.2vw; margin-bottom: 8.9vw;}

/* //.section3 */

/* .section4 */

.section4{padding-top: 15vw;}

.section4 .container{padding-bottom: 15vw;}

.section4 h2{font-size: 4.4vw;}

.section4 h2+p{font-size: 6vw; margin-bottom: 7.1vw; letter-spacing: -.3vw;}

.swiperBox{padding-top: 63px; margin-bottom: 0;}
.swiperBox.SB1{padding-top: 0;}

.swiperBox.SB1 .step{top: 2.2vw;}
.swiperBox .step{top: 18vw; /* padding: 2vw; */ padding-top: 4vw;}

.section4 .step h3{font-size: 3.7vw; margin-bottom: 2vw;}

.swiperBox .step h4{font-size: 3.1vw; margin: 0 auto 5vw; line-height: 1.5;}

.swiperBox .step ul li{width: 49%;}

.swiperBox .step ul li a span{font-size: 3.1vw; line-height: 1; font-weight: 500; letter-spacing: -.1vw; padding-bottom: 0;}

.swiperBox .step ul li a.step01{transform: translateX(1.4vw);}
.swiperBox .step ul li a.step02{transform: translateX(-1.4vw);}

.swiperBox.SB2 .step ul li{width: 33.3%;}
.swiperBox.SB2 .step ul li a span{font-size: 2.5vw; line-height: 1;}


.section4 .swiper.mySwiper{border-radius: 6.6vw; height: auto;}

.swiper02 .swiper-wrapper .swiper-slide>img{height: auto;}


/* //.section4 */

/* .section5 */

.section5{height: 37vw;}

.section5 .container .desc{font-size: 4vw;}

.section5 .container h2{font-size: 4.5vw;}

/* //.section5 */
}