#contents.slp-plus #target01 {
  padding: 120px 0;
}
#contents.slp-plus #target01 h5 {
  font-size: 40px;
  font-weight: 800;
}
#contents.slp-plus #target01 > div {
  max-width: 1200px;
  display: flex;
  flex-direction: row;
  margin: 0 auto;
}
#contents.slp-plus #target01 .mySwiper_mob .swiper-slide {
  width: calc(100%/3);
}
#contents.slp-plus #target01 .mySwiper_mob .swiper-slide img {
  width: 100%;
  height: auto;
}
#contents.slp-plus #target01 .mySwiper_mob .swiper-slide h5 {
  font-size: 20px;
  margin: 30px 0 15px;
}
#contents.slp-plus #target01 .mySwiper_mob .swiper-slide p {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  word-break: keep-all;
}
#bg_gradi {
  background: rgb(242,243,248);

}
#contents.slp-plus #target02, #contents.slp-plus #target03 {
  margin: 0 auto;
  padding: 132px 2% 0;
}
#contents.slp-plus #target03 {
  padding-bottom: 100px;
}
#contents.slp-plus .swiperDep01 {
  padding-top: 120px;
  max-width: 1500px;
  margin: 0 auto;
}

.slp-plus .tabContent h5 {
  font-size: 40px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 35px;
  letter-spacing: -0.02em;
}
.slp-plus .tabContent#target03 h5 {
  margin: 0 0 35px;
}

#contents .box-max-1200 {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}
#contents.slp-plus .swiperDep01 > .nav_box > .swiper-pagination {
  width: 100%;
  display: flex;
  flex-direction: row;
  top: -120px;
  justify-content: space-between;
  background: #fff;
  border-radius: 50px;
  padding: 0 10px;
  }
#contents.slp-plus .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet {
  width: auto;
  border-radius: 30px;
  margin: 10px 0;
  line-height: 0px;
  padding: 27px 20px;
}
#contents.slp-plus .swiper {height: 100%;}
.swiper.mySwiper .swiper-pagination-bullet {background: none;}
.swiper.mySwiper-02 .swiper-pagination-bullet {background: rgba(0, 32, 96, .25);}
#target02 .swiper.mySwiper-02 .swiper-pagination-bullet.swiper-pagination-bullet-active {background: #4415A0;}
#target03 .swiper.mySwiper-02 .swiper-pagination-bullet.swiper-pagination-bullet-active {background: #002060;}
#target02 .swiper > .nav_box {max-width: 1120px; margin: 0 auto; position: relative;}
#target03 .swiper > .nav_box {max-width: 761px; margin: 0 auto; position: relative;}
.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: inherit;}
#contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #4415A0;
  color: #fff;
}
#contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p {
  font-weight: 500;
  letter-spacing: -0.02em;
}
#contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #002060;
  color: #fff;
}
#contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p {
  font-weight: 500;
  letter-spacing: -0.02em;

}
#contents.slp-plus .swiperDep01 > .nav_box > .swiper-wrapper {
  width: 100%;
}
#contents.slp-plus .swiper-slide.sl-01 {
  /* padding-left: 50%; */
  background-size: cover;
  background-position: center;
  border-radius: 15px;
  height: 680px;
}
#contents.slp-plus .mySwiper-02 .swiper-slide {
  overflow: hidden;
  display: flex;
  justify-content: space-around;
}
#contents.slp-plus .mySwiper-02 .swiper-pagination {
  width: auto;
  height: auto;
  position: absolute;
  bottom: inherit;
  left: 4.5%;
  top: 470px;
  transform: scale(0.7);
}
#contents.slp-plus .mySwiper-02 .swiper-pagination-bullet {width: 15px; height: 15px;}
#contents.slp-plus .mySwiper-02 .swiper-pagination-bullet.swiper-pagination-bullet-active {width: 40px; border-radius: 10px;}

#contents.slp-plus .mySwiper-02 .box-max-1200 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0 5%;
  box-sizing: content-box;
}
#contents.slp-plus .mySwiper-02 .box-max-1200 .text-box span {
  font-size: 20px;
  font-weight: 400;
  color: #333399;
  letter-spacing: -0.02em;
}
#contents.slp-plus .mySwiper-02 .box-max-1200 .text-box h1 {
  font-size: 42px;
  font-weight: 700;
  margin: 12px 0 33px;
  letter-spacing: -0.02em;
}
#contents.slp-plus .mySwiper-02 .box-max-1200 .text-box p {
  font-size: 20px;
  font-weight: 400;
  color: #666666;
  line-height: 25px;
  word-break: keep-all;
  letter-spacing: -0.02em;
}
#contents.slp-plus .mySwiper-02 .motion-box {
  position: relative;
}
#contents.slp-plus .mySwiper-02 .motion-box > img {
  max-width: 560px;
  image-rendering: -moz-crisp-edges; /* firefox */
  image-rendering: -o-crisp-edges; /* opera */
  image-rendering: -webkit-optimize-contrast; /* chrome(비표준) */
  image-rendering: crisp-edges;
  transform:translateZ(0);
  backface-visibility:hidden;
}
#contents.slp-plus .mySwiper-02 .motion-box.mockup2 {
  position: relative;
  width: 45%;
  margin: 0 auto;
}
#contents.slp-plus .mySwiper-02 .motion-box .motion-top {
  position: absolute;
  top: 18%;
  left: 50px;
}
#contents.slp-plus .mySwiper-02 .slide-01.swiper-slide-active .motion-top {
  animation: motion1 1.5s cubic-bezier(0.19, 0.78, 0.47, 1.42) forwards;
  background-image: url('/resources/images/slp/page/sl/motion_01.png');
  width: 380px;
  height: 371px;
}
#contents.slp-plus .mySwiper-02 .motion-box .motion-left {
  position: absolute;
  bottom: -50px;
  left: -220px;
}
#contents.slp-plus .mySwiper-02 .slide-01.swiper-slide-active .motion-left {
  animation: motion2 1s cubic-bezier(0.19, 0.78, 0.47, 1.42) forwards;
  background-image: url('/resources/images/slp/page/sl/motion_02.png');
  width: 458px;
  height: 171px;
}
#contents.slp-plus .mySwiper-02 .motion-box .motion-right {
  position: absolute;
  bottom: -40px;
  right: -212px;
}
#contents.slp-plus .mySwiper-02 .slide-01.swiper-slide-active .motion-right {
  animation: motion3 1s cubic-bezier(0.19, 0.78, 0.47, 1.42) forwards;
  background-image: url('/resources/images/slp/page/sl/motion_03.png');
  width: 284px;
  height: 390px;
}



@keyframes motion1 {
  0% {
    transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    opacity: 0;
  }
  40% {
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    opacity: 1;
  }
}

@keyframes motion2 {
  0% {
    transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: translateY(-400px);
    opacity: 0;
  }
  50% {
    transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: translateY(-400px);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes motion3 {
  0% {
    transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: translateY(400px);
    opacity: 0;
  }
  60% {
    transform: scale(0);
    -moz-transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: translateY(400px);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: translateY(0px);
    opacity: 1;
  }
}
#slide_01_01 {background: url('/resources/images/slp/page/sl/slide_bg_01_01.png') no-repeat;}
#slide_01_02 {background: url('/resources/images/slp/page/sl/slide_bg_01_02.png') no-repeat;}
#slide_01_03 {background: url('/resources/images/slp/page/sl/slide_bg_01_03.png') no-repeat;}
#slide_01_04 {background: url('/resources/images/slp/page/sl/slide_bg_01_04.png') no-repeat;}
#slide_01_05 {background: url('/resources/images/slp/page/sl/slide_bg_01_05.png') no-repeat;}
#slide_01_06 {background: url('/resources/images/slp/page/sl/slide_bg_01_06.png') no-repeat;}
#slide_01_07 {background: url('/resources/images/slp/page/sl/slide_bg_01_07.png') no-repeat;}
#slide_01_08 {background: url('/resources/images/slp/page/sl/slide_bg_01_08.png') no-repeat;}
#slide_02_01 {background: url('/resources/images/slp/page/sl/slide_bg_02_01.png') no-repeat;}
#slide_02_02 {background: url('/resources/images/slp/page/sl/slide_bg_02_02.png') no-repeat;}
#slide_02_03 {background: url('/resources/images/slp/page/sl/slide_bg_02_03.png') no-repeat;}
#slide_02_04 {background: url('/resources/images/slp/page/sl/slide_bg_02_04.png') no-repeat;}
#slide_02_05 {background: url('/resources/images/slp/page/sl/slide_bg_02_05.png') no-repeat;}
#slide_02_06 {background: url('/resources/images/slp/page/sl/slide_bg_02_06.png') no-repeat;}

#contents.slp-plus .app {background-color: #fff;}
#contents.slp-plus .app > div::before {display: none;}
#contents.slp-plus .app::before {
  background-size: 790px;
}
#contents.slp-plus .app > div h4 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.05em;
  color: #190F6E;
  margin-bottom: 5px;
}

@media (min-width: 1025px) {
  #contents.slp-plus .app {
    padding: 222px 0 200px;
    max-width: 1200px;
    margin: 0 auto;
    margin-bottom: 100px;
  }
  #contents.slp-plus .app::before {
    top: -20px;
    right: -145px;
  }
  /* #contents.slp-plus .app > div strong {
    font-size: 36px;
  } */
  #contents.slp-plus .app > div p {
    width: calc(100% - 580px);
  }
}
@media (max-width: 1024px) {
  #contents.slp-plus .app::before {
    width: 36vw;
    right: 0;
  }
  #contents.sl .contentHeader .vi p {
    color: #222222;
  }
  #contents.sl .contentHeader .slVi:not(.case01) {
    padding-top: 22%;
  }
  #contents.sl .app > div .buttons {margin-top: 410px;}

  #contents.slp-plus #target02, #contents.slp-plus #target03 {
    padding: 82px 2% 0;
  }
  #contents.slp-plus #target03 {margin-bottom: 0; padding-bottom: 10%;}
}

@media (max-width: 1023px) {


  #contents.slp-plus #target01 {padding: 50px 0;}
  #contents.slp-plus #target01 h5 {font-size: 26px;}
  #contents.slp-plus #target01 > div {flex-direction: column;}
  #contents.slp-plus #target01 > div div {width: 100%; margin-top: 20px;}
  #contents.slp-plus #target01 > div div:first-child {margin-top: 0;}
  #contents .swiperDep01 > .nav_box {height: 100px; max-width: unset; overflow: auto; scrollbar-width: none; scrollbar-color: transparent transparent;}
  #contents .swiperDep01 > .nav_box::-webkit-scrollbar-track {display: none; background-color: transparent;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1);}
  #contents .swiperDep01 > .nav_box::-webkit-scrollbar {display: none; background-color: transparent;}
  #contents .swiperDep01 > .nav_box::-webkit-scrollbar-thumb {display: none; background-color: transparent; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1);}
  #contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination::before {position: absolute}
  #contents.slp-plus .swiperDep01 > .nav_box > .swiper-pagination {
    flex-direction: row;
    min-width: 480px;
    max-width: 1030px;
    width: 1030px;
    top: 0;
  }
  #contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination {
    width: 720px;
  }
  #contents.slp-plus .mySwiper-02 .motion-box {width: 100% !important;}
  #contents.slp-plus .mySwiper-02 .motion-box.mockup2 img {width: 100%; height: auto;}

  #contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination::before, #contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination::before {
    display: none;
  }


  #contents.slp-plus .swiper-slide.sl-01 {min-height: 500px; height: 100%; border-radius: 35px;}
  #contents.slp-plus .sl-02 .box-max-1200 {flex-direction: column; padding: 100px 20px;}
  #contents.slp-plus .swiperDep01 {padding-top: 0px;}
  #contents.slp-plus .mySwiper-02 > .box-max-1200 {position: absolute; top: 95%; left: 50%; transform: translate(-50%, -50%);}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box {text-align: center; margin-bottom: 2vw;}
  /* #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box br {display: none;} */

  /* #contents.slp-plus .mySwiper-02 .box-max-1200 .motion-box {margin-top: 10px;} */
  #contents.slp-plus .mySwiper-02 .box-max-1200 .motion-box img {width: 100%;}
  #contents.slp-plus .mySwiper-02 .swiper-pagination {left: inherit; top: inherit; transform: inherit; }

  #contents.sl .app {
    padding-bottom: 200px !important;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 83px !important;
  }
  #contents.slp-plus .app::before {
    width: 100%;
    top: 315px;
    background-size: 430px;
    background-position: -60px 36px;
  }

}

@media (max-width: 720px) {
  #contents .swiperDep01 > .nav_box {height: 75px;}
  #contents.slp-plus .swiperDep01 > .nav_box > .swiper-pagination{background: transparent;}
  #contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active {background: transparent;}
  #contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p {color: #4415A0;}
  #contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active {background: transparent;}
  #contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p {color: #002060;}
  #contents.slp-plus .app > div strong {line-height: 36px; margin: 23px 0;}
  #contents.slp-plus .app > div p {line-height: 36px; margin-top: 0;}

  #contents.sl .contentHeader .vi {padding: 0 20px; align-items: flex-start;}
  #contents.sl .contentHeader .vi p {font-size: 30px; line-height: 43px; letter-spacing: -1px; text-align: left;}
  #contents.sl .contentHeader .slVi h2 {font-size: 30px;}
  #contents.sl .contentHeader .slVi p {font-size: 22px; line-height: 36px; letter-spacing: -1px;}
  #contents.sl .contentHeader .slVi p strong {display: block; margin-top: 25px;}
  .slp-plus .tabContent h5 {font-size: 30px; margin: 0 0 10px !important;}
  #contents.slp-plus #target02 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p, #contents.slp-plus #target03 .swiperDep01 > .nav_box > .swiper-pagination > .swiper-pagination-bullet.swiper-pagination-bullet-active p{font-size: 18px;}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box span {font-size: 18px;}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box h1 {font-size: 28px; margin: 10px 0 15px; line-height: 35px;}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box p {font-size: 16px; min-height: 80px; line-height: 26px;}
}

@media (max-width: 480px) {
  #contents.sl .contentHeader .vi p {
    color: #ffffff;
  }
}

@media (max-width: 440px) {
  /* .slp-plus .tabContent h5 {font-size: 7.333vw; margin: 25px 0 0px;} */

  #contents.slp-plus .sl-02 .box-max-1200 {flex-direction: column; padding: 18% 2%;}
  /* #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box span {font-size: 5vw;}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box h1 {font-size: 7.222vw; margin: 10px 0 15px;}
  #contents.slp-plus .mySwiper-02 .box-max-1200 .text-box p {font-size: 4.556vw; min-height: 80px;} */
  /* #contents.slp-plus .mySwiper-02 .swiper-pagination { bottom: inherit; top: inherit;} */

}