@charset "UTF-8";
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css);
* {
  margin: 0;
  padding: 0;
}

html {
  overflow-x: hidden;
  overflow-y: scroll;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  color: #333;
  font-style: normal;
  font-size: 12px;
  font-family: "nsr", NanumBarunGothic, NanumBarunGothicWeb, "돋움", dotum, Helvetica, sans-serif;
  line-height: 160%;
  border: 0 none;
}

body {
  font-family: "NanumSquare", sans-serif;
}

.normal {
  font-weight: 400;
}

.bold {
  font-weight: 700;
}

.bolder {
  font-weight: 800;
}

.light {
  font-weight: 300;
}

/**********************
사이트 내에 삽입시 위에 내용은 삭제 해주세요
*********************/
body {
  overflow-x: hidden;
}

#e_eventWrap {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  min-width: 1100px;
}

#e_eventWrap img {
  border: 0 none;
  vertical-align: bottom;
}

.e_ContentWrap {
  width: 900px;
  height: 100%;
  margin: 0 auto;
}

.relative {
  position: relative;
}

.fix_banner {
  z-index: 1000;
  position: fixed;
  bottom: -1px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fix_banner_mo {
  z-index: 1000;
  position: fixed;
  bottom: 0;
}
.fix_banner_mo img {
  width: 100%;
}

.top_banner_scroll {
  z-index: 1000;
  position: fixed;
  bottom: 10px;
  right: 80px;
  width: 61px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 801px) {
  .fix_banner_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .fix_banner {
    display: none;
  }
  .top_banner_scroll {
    right: 10px;
    bottom: 80px;
  }
}
.step01 {
  width: 100%;
  height: 499px;
  background: #003467 url(img/step01.png) no-repeat center top;
}

.step01_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step01 {
    display: block;
  }
  .step01_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step01 {
    display: none;
  }
  .step01_mo {
    display: block;
  }
}
.step02 {
  width: 100%;
  height: 153px;
  background: #001e3c url(img/step02.png) no-repeat center top;
}

.step02_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step02 {
    display: block;
  }
  .step02_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step02 {
    display: none;
  }
  .step02_mo {
    display: block;
  }
}
.step03 {
  width: 100%;
  height: 595px;
  background: #fff url(img/step03_240131.png) no-repeat center top;
}

.step03_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step03 {
    display: block;
  }
  .step03_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step03 {
    display: none;
  }
  .step03_mo {
    display: block;
  }
}
.step04 {
  width: 100%;
  height: 866px;
  background: #ffd441 url(img/step04.png) no-repeat center top;
}

.step04_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step04 {
    display: block;
  }
  .step04_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step04 {
    display: none;
  }
  .step04_mo {
    display: block;
  }
}
.step05 {
  width: 100%;
  height: 710px;
  background: #fff url(img/step05.png) no-repeat center top;
  padding-top: 280px;
}
.step05 .slick-slide img {
  width: 300px;
}
.step05 .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 29px;
  height: 41px;
  border: none;
  text-indent: -9999px;
  overflow: hidden;
}
.step05 .slick-prev {
  background: url(img/pre.svg) no-repeat 0 0;
  z-index: 100;
  position: absolute;
  left: -5%;
}
.step05 .slick-next {
  background: url(img/next.svg) no-repeat 0 0;
  z-index: 100;
  position: absolute;
  right: -5%;
}
.step05 .slick-dots {
  position: absolute;
  bottom: 20px;
  left: 50%;
  bottom: -10%;
  transform: translateX(-50%);
}
.step05 .slick-dots li {
  float: left;
  list-style: none;
  margin: 0 10px;
}
.step05 .slick-dots li button {
  width: 10px;
  height: 10px;
  background-color: #000000;
  border: none;
  text-indent: -9999px;
  overflow: hidden;
  border-radius: 20px;
}
.step05 .slick-dots .slick-active button {
  width: 10px;
  height: 10px;
  background-color: red;
  border: none;
  text-indent: -9999px;
  overflow: hidden;
  border-radius: 20px;
}

.step05_mo img {
  width: 100%;
}
.step05_mo .slick-slide img {
  width: 100%;
  padding: 0px 50px 50px 50px;
}
.step05_mo .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 17px;
  height: 22px;
  border: none;
  text-indent: -9999px;
  overflow: hidden;
}
.step05_mo .slick-prev {
  background: url(img/pre_mo.svg) no-repeat 0 0;
  z-index: 100;
  position: absolute;
  left: 5%;
}
.step05_mo .slick-next {
  background: url(img/next_mo.svg) no-repeat 0 0;
  z-index: 100;
  position: absolute;
  right: 5%;
}
.step05_mo .slick-dots {
  display: none !important;
}

@media (min-width: 801px) {
  .step05 {
    display: block;
  }
  .step05_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step05 {
    display: none;
  }
  .step05_mo {
    display: block;
  }
}
.step06 {
  width: 100%;
  height: 552px;
  background: #fff5d2 url(img/step06.png) no-repeat center top;
}

.step07_mo .book .bookline2, .step07_mo .book .bookline, .step07 .book .bookline2, .step07 .book .bookline {
  display: flex;
  gap: 10px;
}
.step07_mo .book .bookline2 img, .step07_mo .book .bookline img, .step07 .book .bookline2 img, .step07 .book .bookline img {
  border-radius: 10px;
  width: 146px;
}

.step06_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step06 {
    display: block;
  }
  .step06_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step06 {
    display: none;
  }
  .step06_mo {
    display: block;
  }
}
.step07 {
  width: 100%;
  height: auto;
  background: #ffffff url(img/step07.png) no-repeat center top;
  padding-top: 298px;
}
.step07 .book {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.step07 .book .bookline {
  animation: 40s linear 0s infinite normal none running textLoop_left;
}
@keyframes textLoop_left {
  0% {
    transform: translate3d(-1135px, 0px, 0px);
  }
  100% {
    transform: translate3d(0px, 0px, 0px);
  }
}
.step07 .book .bookline2 {
  animation: 40s linear 0s infinite normal none running textLoop_right;
}
@keyframes textLoop_right {
  0% {
    transform: translate3d(0px, 0px, 0px);
  }
  100% {
    transform: translate3d(-1135px, 0px, 0px);
  }
}

.step07_mo {
  width: 100%;
  height: auto;
}
.step07_mo img {
  width: 100%;
}
.step07_mo .book {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.step07_mo .book .bookline {
  animation: 40s linear 0s infinite normal none running textLoop_left;
}
@keyframes textLoop_left {
  0% {
    transform: translate3d(-1135px, 0px, 0px);
  }
  100% {
    transform: translate3d(0px, 0px, 0px);
  }
}
.step07_mo .book .bookline2 {
  animation: 40s linear 0s infinite normal none running textLoop_right;
}
@keyframes textLoop_right {
  0% {
    transform: translate3d(0px, 0px, 0px);
  }
  100% {
    transform: translate3d(-1135px, 0px, 0px);
  }
}

@media (min-width: 801px) {
  .step07 {
    display: block;
  }
  .step07_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step07 {
    display: none;
  }
  .step07_mo {
    display: block;
  }
  .step07_mo .book .bookline img {
    width: 20%;
  }
  .step07_mo .book .bookline2 img {
    width: 20%;
  }
}
.step08 {
  width: 100%;
  height: 556px;
  padding-top: 80px;
}
.step08 .slick-slide img {
  width: 900px;
  padding-bottom: 20px;
}
.step08 .left {
  position: absolute;
  width: 40px;
  height: 180px;
  background-color: rgb(255, 255, 255);
  bottom: 95px;
  z-index: 500;
}
.step08 .right {
  position: absolute;
  width: 50px;
  height: 180px;
  background-color: rgb(255, 255, 255);
  bottom: 95px;
  z-index: 500;
  right: 0;
}
.step08 .slider-nav img {
  padding-top: 30px;
  width: 90px;
  filter: grayscale(100%);
}
.step08 .slider-nav .slick-current img {
  filter: grayscale(0%);
}

.step08_mo {
  width: 100%;
  padding: 80px 0;
}
.step08_mo .slider-for-mo img {
  width: 100%;
  padding: 0 30px;
}
.step08_mo .slider-nav-mo {
  width: 100%;
}
.step08_mo .slider-nav-mo img {
  padding-top: 30px;
  width: 80px;
  filter: grayscale(100%);
}
.step08_mo .slider-nav-mo .slick-current img {
  filter: grayscale(0%);
}

@media (min-width: 801px) {
  .step08 {
    display: block;
  }
  .step08_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step08 {
    display: none;
  }
  .step08_mo {
    display: block;
  }
}
.step09 {
  width: 100%;
  height: 1359px;
  background: #dcf1b1 url(img/step09.png) no-repeat center top;
}

.step09_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step09 {
    display: block;
  }
  .step09_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step09 {
    display: none;
  }
  .step09_mo {
    display: block;
  }
}
.step10 {
  width: 100%;
  height: 1013px;
  background: #fff url(img/step10.png) no-repeat center top;
}

.step10_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step10 {
    display: block;
  }
  .step10_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step10 {
    display: none;
  }
  .step10_mo {
    display: block;
  }
}
.step11 {
  width: 100%;
  height: 1119px;
  background-color: #6d06b3;
  padding-top: 115px;
}
.step11 .e_ContentWrap {
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-gap: 100px;
  align-items: start;
}
.step11 .e_ContentWrap .left {
  padding-top: 40px;
  position: sticky;
  top: 0px;
  padding-bottom: 115px;
}
.step11 .e_ContentWrap .right {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.step11_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step11 {
    display: block;
  }
  .step11_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step11 {
    display: none;
  }
  .step11_mo {
    display: block;
  }
}
.step12 {
  width: 100%;
  height: 986px;
  background: #b5dff6 url(img/step12.png) no-repeat center top;
}

.step12_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step12 {
    display: block;
  }
  .step12_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step12 {
    display: none;
  }
  .step12_mo {
    display: block;
  }
}
.step13 {
  width: 100%;
  height: 344px;
  background: #fff url(img/step13.png) no-repeat center top;
  position: relative;
}
.step13 .freebtn {
  position: absolute;
  width: 878px;
  height: 97px;
  top: 185px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
}

.step13_mo {
  display: flex;
  flex-direction: column;
}
.step13_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step13 {
    display: block;
  }
  .step13_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step13 {
    display: none;
  }
  .step13_mo {
    display: block;
  }
}
.step14 {
  width: 100%;
  height: 1230px;
  background: #fff url(img/step14.png) no-repeat center top;
}

.step14_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step14 {
    display: block;
  }
  .step14_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step14 {
    display: none;
  }
  .step14_mo {
    display: block;
  }
}
.step15 {
  width: 100%;
  height: 264px;
  background: #fff;
  position: relative;
}
.step15 .freebtn {
  position: absolute;
  width: 878px;
  height: 347px;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
}

.step15_mo {
  padding-bottom: 120px;
}
.step15_mo img {
  width: 100%;
}

@media (min-width: 801px) {
  .step15 {
    display: block;
  }
  .step15_mo {
    display: none;
  }
}
@media (max-width: 800px) {
  .step15 {
    display: none;
  }
  .step15_mo {
    display: block;
  }
}
.good-readigngate,
.level-composition {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.good-readigngate .title,
.level-composition .title {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #fff5d2;
}
.good-readigngate .slide-tit,
.level-composition .slide-tit {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #e3f6ff;
}
.good-readigngate .slide-gallary,
.level-composition .slide-gallary {
  width: 100%;
  background-color: #e3f6ff;
  margin: auto;
  display: flex;
  justify-content: center;
}
.good-readigngate .slide-gallary .single-item,
.level-composition .slide-gallary .single-item {
  width: 963px;
  background-color: #ffffff;
  padding-bottom: 30px;
  border-radius: 0 0 50px 50px;
  margin-bottom: 80px;
}
.good-readigngate .slide-gallary .single-item .tit,
.level-composition .slide-gallary .single-item .tit {
  width: 673px;
  margin-bottom: 30px;
}
.good-readigngate .slide-gallary .single-item img,
.level-composition .slide-gallary .single-item img {
  width: 90%;
  margin: auto;
}
.good-readigngate .slide-gallary .single-item .slick-dots,
.level-composition .slide-gallary .single-item .slick-dots {
  list-style: none;
  border: none;
  text-indent: -9999px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  gap: 5px;
  margin: 20px 0 0 0;
}
.good-readigngate .slide-gallary .single-item .slick-dots li,
.level-composition .slide-gallary .single-item .slick-dots li {
  background-color: #d2d2d2;
  width: 6px;
  height: 6px;
  padding: 5px;
  border-radius: 10px;
}
.good-readigngate .slide-gallary .single-item .slick-dots .slick-active,
.level-composition .slide-gallary .single-item .slick-dots .slick-active {
  background-color: #4bbcff;
}
.good-readigngate .slide-gallary .single-item .slick-prev,
.level-composition .slide-gallary .single-item .slick-prev {
  background: url(img/new/prev-blue.png) no-repeat 0 0;
  left: -70px;
}
.good-readigngate .slide-gallary .single-item .slick-next,
.level-composition .slide-gallary .single-item .slick-next {
  background: url(img/new/next-blue.png) no-repeat 0 0;
  right: -70px;
}
.good-readigngate .slide-gallary .single-item .slick-arrow,
.level-composition .slide-gallary .single-item .slick-arrow {
  width: 50px;
  height: 68px;
  border: none;
  text-indent: -99999px;
  overflow: hidden;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.good-readigngate .slide-bottom,
.level-composition .slide-bottom {
  display: flex;
  justify-content: center;
  width: 100%;
  background-color: #e3f6ff;
  padding-bottom: 80px;
}
.good-readigngate .point,
.level-composition .point {
  display: flex;
  gap: 20px;
  justify-content: center;
  background-color: #e3f6ff;
  font-size: 20px;
  line-height: 30px;
  text-align: left;
  padding: 0px 20px 20px 20px;
}
.good-readigngate .point .mo,
.level-composition .point .mo {
  width: 95%;
}
.good-readigngate .point-step,
.level-composition .point-step {
  background-color: #e3f6ff;
  justify-content: center;
  display: flex;
  gap: 20px;
}
.good-readigngate .slide-dec,
.level-composition .slide-dec {
  background-color: #e3f6ff;
  padding: 0 0 30px 0;
  display: flex;
  justify-content: center;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
  padding: 0px 20px 30px 20px;
}
.good-readigngate .web,
.level-composition .web {
  display: block;
}
.good-readigngate .mo,
.level-composition .mo {
  display: none;
}

.pink .slide-tit {
  background-color: #fff0ef;
  padding: 50px 0 20px 0;
}
.pink .slide-dec {
  background-color: #fff0ef;
}
.pink .slide-level {
  padding-bottom: 30px;
  background-color: #fff0ef;
  display: flex;
  justify-content: center;
}
.pink .slide-gallary {
  background-color: #fff0ef;
}
.pink .slide-gallary .single-item {
  border-radius: 50px;
  padding-top: 30px;
}
.pink .slide-gallary .single-item .slick-prev {
  background: url(img/new/prev-pink.png) no-repeat 0 0;
}
.pink .slide-gallary .single-item .slick-next {
  background: url(img/new/next-pink.png) no-repeat 0 0;
}
.pink .slide-gallary .single-item .slick-dots .slick-active {
  background-color: #ff8199;
}
.pink .slide-gallary .single-item .tit {
  width: 226px;
  border-radius: 0;
}

.blue .slide-tit {
  background-color: #e3f6ff;
  padding: 80px 0 40px 0;
}
.blue .slide-gallary {
  background-color: #e3f6ff;
}
.blue .slide-gallary .single-item {
  border-radius: 50px;
  padding-top: 30px;
}
.blue .slide-gallary .single-item .tit {
  width: 226px;
}

.ai-sudio .slide-gallary .single-item .tit {
  width: 414px;
}

@media (max-width: 800px) {
  .web {
    display: none !important;
  }
  .mo {
    display: block !important;
  }
  .good-readigngate .point,
  .level-composition .point {
    flex-direction: column !important;
    gap: 20px !important;
    padding-bottom: 20px !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: 14px !important;
    line-height: 20px !important;
    text-align: center;
  }
  .good-readigngate .point .book,
  .level-composition .point .book {
    max-width: 30% !important;
  }
  .good-readigngate .point img,
  .level-composition .point img {
    max-width: 95% !important;
  }
  .good-readigngate .slick-arrow,
  .level-composition .slick-arrow {
    display: none !important;
  }
  .good-readigngate .slick-dots,
  .level-composition .slick-dots {
    padding: 0 !important;
    margin: 16px 0 0 0 !important;
  }
  .good-readigngate .slick-dots li,
  .level-composition .slick-dots li {
    width: 2px !important;
    height: 2px !important;
  }
  .good-readigngate .title img,
  .level-composition .title img {
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
  }
  .good-readigngate .slide-tit img,
  .level-composition .slide-tit img {
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
  }
  .good-readigngate .slide-gallary .single-item,
  .level-composition .slide-gallary .single-item {
    max-width: 100% !important;
    padding-bottom: 30px !important;
    margin-bottom: 50px !important;
    border-radius: 0 0 20px 20px !important;
  }
  .good-readigngate .slide-gallary .single-item img,
  .level-composition .slide-gallary .single-item img {
    max-width: 90% !important;
    height: auto !important;
    width: auto !important;
    border-radius: 10px !important;
  }
  .good-readigngate .slide-gallary .single-item .tit,
  .level-composition .slide-gallary .single-item .tit {
    max-width: 90% !important;
    height: auto !important;
    width: auto !important;
  }
  .good-readigngate .slide-gallary .single-item .slick-prev,
  .level-composition .slide-gallary .single-item .slick-prev {
    transform: scale(0.5) !important;
    left: 170px !important;
  }
  .good-readigngate .slide-bottom,
  .level-composition .slide-bottom {
    padding-bottom: 40px !important;
  }
  .good-readigngate .slide-bottom img,
  .level-composition .slide-bottom img {
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
  }
  .good-readigngate .point-step img,
  .level-composition .point-step img {
    max-width: 80% !important;
    height: auto !important;
    width: auto !important;
    padding-bottom: 50px !important;
  }
  .good-readigngate .slide-dec,
  .level-composition .slide-dec {
    font-size: 14px;
    line-height: 20px;
  }
  .pink .slide-dec {
    background-color: #fff0ef;
  }
  .pink .slide-level img {
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
  }
  .pink .slide-gallary .single-item {
    border-radius: 20px !important;
  }
  .pink .slide-gallary .single-item .tit {
    max-width: 30% !important;
  }
  .blue .slide-tit {
    padding: 50px 0 20px 0;
  }
  .blue .slide-gallary .single-item {
    border-radius: 20px !important;
  }
  .blue .slide-gallary .single-item .tit {
    max-width: 30% !important;
  }
  .blue .point-step {
    padding: 0;
  }
  .ai-sudio .slide-gallary .single-item {
    border-radius: 20px !important;
  }
  .ai-sudio .slide-gallary .single-item .tit {
    max-width: 50% !important;
  }
}
.b2b_container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.b2b_container a {
  text-decoration: none;
}
.b2b_container img {
  display: block;
}
.b2b_container .tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  width: 100%;
  max-width: 800px;
  position: sticky;
  top: 0;
}
.b2b_container .tabs .tab {
  width: 100%;
}
.b2b_container .tabs .tab button {
  width: 100%;
  min-height: 50px;
  border-bottom: 1.5px solid #000000;
  border-radius: 0;
  font-weight: 600;
  font-size: 1.5em;
  background-color: #f0f2f5;
}
.b2b_container .tabs .tab .active {
  background-color: #000000;
  border-bottom: 1.5px solid #000000;
}
.b2b_container .contents {
  width: 100%;
  max-width: 800px;
}
.b2b_container .contents .tab_contents_01 .media_contents {
  min-height: 300px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  background-color: #ffffff;
}
.b2b_container .contents .tab_contents_01 .btn_group_bottom {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  width: 100%;
  max-width: 800px;
}/*# sourceMappingURL=style.css.map */