@charset "UTF-8";
/*! mobile 버전 - css */
@media (max-width: 1023px){
.content-box.step-type .round-type-tag{margin-top:3.5rem;margin-bottom:0}
.align-center-box.type01{margin-bottom:2rem}
.align-center-box.type01 .round-type-tag{margin-bottom:1rem}
.align-center-box.type01 .align-center-box-desc{margin-top:0.6rem;font-size:1.4rem;line-height:1.71;text-align:center;color:#222}
.mo-show{display:block}
.pc-show{display:none}
.public-swiper-container.pb-45.mt-80{padding-bottom:3rem;margin-top:5rem}
.swiper-container.public-swiper-container.ui-public-swiper.pb-20.mt-10{margin-top:0}
.swiper-container.public-swiper-container.ui-public-swiper.pb-20.mt-10 .align-center-box-desc{margin-top:0.6rem;margin-bottom:3.6rem}
.cont-inner{padding-top:2.5rem;padding-right:2.5rem;padding-bottom:2.5rem;padding-left:2.5rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;background-color:#fff}
.cont-inner .flex-item{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;width:30%}
.cont-inner .flex-item .img-wrap{position:relative;width:100%}
.cont-inner .flex-item .img-wrap img{width:100%;max-height:20.9rem;z-index:2;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.cont-inner .flex-item .img-wrap .preview-btn{position:absolute;right:2.3rem;top:42%;margin-top:-0.5rem;border-radius:3.5rem;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.cont-inner .flex-item .txt-area.bookstore{height:2rem;padding:0}
.cont-inner .flex-item .txt-area.bookstore span{font-size:1.2rem;line-height:1.83;height:3rem;text-align:center;line-height:1.2}
.title-area{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding-right:6rem;padding-left:6rem}
.title-area span{font-size:1.8rem;line-height:1.55;line-height:1.55}
.step-1::before{height:-webkit-calc(100% - 220px);height:calc(100% - 220px);height:-webkit-calc(100% - 22rem);height:calc(100% - 22rem)}
.step-3::before{height:-webkit-calc(100% - 260px);height:calc(100% - 260px);height:-webkit-calc(100% - 26rem);height:calc(100% - 26rem)}
.step-3 .container-row.pd-center{margin-top:2rem}
.step-3 .item-content:nth-child(1n+3){margin-top:1.5rem}
.step-3 .public-swiper-container{margin-top:1rem}
.step-4{padding-bottom:6rem}
.step-4::before{height:-webkit-calc(100% - 150px);height:calc(100% - 150px);height:-webkit-calc(100% - 15rem);height:calc(100% - 15rem)}
.step-4 .swiper-container.public-swiper-container.ui-public-swiper.pb-30.bookstore{padding-bottom:0.5rem;margin-top:1rem}
.step-4 .container-column > .item-content{background-color:#fff;padding:1.3rem 2.5rem 2rem;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);border-radius:1rem}
.step-4 .container-column > .item-content + .item-content{margin-top:1rem}
.step-4 .container-row .item-content{width:-webkit-calc(100% - 82px);width:calc(100% - 82px);width:-webkit-calc(100% - 8.2rem);width:calc(100% - 8.2rem)}
.step-4 .container-row .item-content.img-box{padding-left:0.7rem;padding-top:3.4rem;width:8.2rem}
.step-4 .container-row .item-content.img-box img{-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.step-4 .number{font-size:1.7rem;line-height:1.58;font-weight:700}
.step-4 .desc{margin-top:0.5rem;font-size:1.3rem;line-height:1.76;font-weight:500}
.step-4 .btn-lv03{margin-top:1.3rem;background-color:#a8509b;border-color:#a8509b;padding:0.3rem 1.5rem 0.4rem;min-width:auto}
.step-4 .btn-lv03 .txt{font-size:1.3rem;line-height:1.76;padding-right:0.2rem;font-weight:400}
.use-tip-area .public-swiper-container{margin-top:0}
.collected-popup .modal-popup-header{padding:2rem 0 2rem 0;border-bottom:1px solid #e5e5e5}
.collected-popup-img-area{padding:3rem 0 3rem 0}
.preview-popup-wrap.has-only-music .preview-popup-dialog{opacity:1}
.preview-popup-wrap.has-only-music .preview-controler-area{-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}
.preview-popup-wrap.has-only-music .preview-controler-area .drop-down-container{margin-left:15px;opacity:0}
.preview-popup-wrap.has-only-music .preview-controler-area .drop-down-btn{min-width:150px}
.step-4-swiper-popup01 .ui-play-pause-btn,.step-4-swiper-popup02 .ui-play-pause-btn,.step-4-swiper-popup03 .ui-play-pause-btn,.step-4-swiper-popup04 .ui-play-pause-btn,.step-4-swiper-popup05 .ui-play-pause-btn,.step-4-swiper-popup06 .ui-play-pause-btn{display:block!important}
}
/*! pc & tablet 버전 - css */
@media (min-width: 1024px){
.content-box.step-type .round-type-tag{margin-top:6rem;margin-bottom:0}
.align-center-box.type01{margin-bottom:2rem}
.align-center-box.type01 .round-type-tag{margin-bottom:1rem}
.align-center-box.type01 .align-center-box-desc{font-size:1.8rem;line-height:1.55;color:#222}
.book-view-container .video-container.bookstore
.thumnail-box .iframe-wrapper{width:100%;height:100%;border-radius:20px;background-color:#fff}
.mo-show{display:none}
.pc-show{display:block}
.public-swiper-container.pb-45.mt-80{padding-bottom:4.5rem;margin-top:8rem}
.swiper-container.public-swiper-container.ui-public-swiper.pb-20.mt-10{margin-top:0.6rem}
.swiper-container.public-swiper-container.ui-public-swiper.pb-20.mt-10 .align-center-box-desc{margin-bottom:6rem}
.cont-area{border-radius:2rem}
.cont-area .cont-inner{padding-top:6rem;padding-right:6rem;padding-bottom:4.2rem;padding-left:6rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;background-color:#fff}
.cont-area .cont-inner .flex-item{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;width:120px}
.cont-area .cont-inner .flex-item .img-wrap{position:relative;width:100%;height:75%}
.cont-area .cont-inner .flex-item .img-wrap img{width:12rem;height:16rem;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.cont-area .cont-inner .flex-item .img-wrap .preview-btn{position:absolute;right:3.2rem;top:40%;margin-top:-0.5rem;border-radius:3.5rem;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.cont-area .cont-inner .flex-item .txt-area.bookstore{margin-top:2rem;padding:0}
.cont-area .cont-inner .flex-item .txt-area.bookstore span{font-size:1.7rem;line-height:1.58;height:5.5rem;text-align:center;line-height:1.2}
.title-area{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding-right:6rem;padding-left:6rem}
.title-area span{font-size:1.8rem;line-height:1.55;line-height:1.55}
.step-1::before{height:-webkit-calc(100% - 300px);height:calc(100% - 300px);height:-webkit-calc(100% - 30rem);height:calc(100% - 30rem)}
.step-2::before{height:-webkit-calc(100% - 300px);height:calc(100% - 300px);height:-webkit-calc(100% - 30rem);height:calc(100% - 30rem)}
.step-3::before{height:-webkit-calc(100% - 300px);height:calc(100% - 300px);height:-webkit-calc(100% - 30rem);height:calc(100% - 30rem)}
.step-3 .container-row.pd-center{margin-top:4rem}
.step-3 .item-content:nth-child(1n+3){margin-top:3.5rem}
.step-3 .public-swiper-container{margin-top:0}
.step-4{padding-bottom:10rem}
.step-4::before{height:-webkit-calc(100% - 230px);height:calc(100% - 230px);height:-webkit-calc(100% - 23rem);height:calc(100% - 23rem)}
.step-4 .container-column{width:60rem;margin:0 auto;margin-top:5.7rem}
.step-4 .container-column > .item-content{background-color:#fff;padding:3.2rem 5rem 3.9rem;-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);border-radius:1rem}
.step-4 .container-column > .item-content + .item-content{margin-top:3rem}
.step-4 .container-row .item-content{width:-webkit-calc(100% - 130px);width:calc(100% - 130px);width:-webkit-calc(100% - 13rem);width:calc(100% - 13rem)}
.step-4 .container-row .item-content.img-box{padding-left:0.7rem;padding-top:3.4rem;width:13rem}
.step-4 .container-row .item-content.img-box img{-webkit-box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16);box-shadow:0.5rem 0.5rem 1rem rgba(0, 0, 0, 0.16)}
.step-4 .number{font-size:2rem;line-height:1.5;font-weight:700}
.step-4 .desc{margin-top:1.2rem;font-size:1.6rem;line-height:1.62;font-weight:500}
.step-4 .btn-lv03{margin-top:1.6rem;background-color:#a8509b;border-color:#a8509b;padding:0.7rem 1.9rem 0.8rem;min-width:auto}
.step-4 .btn-lv03 .txt{font-size:1.6rem;line-height:1.62;padding-right:0.2rem;font-weight:400}
.step-4 .swiper-wrapper{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}
.step-4 .swiper-container.public-swiper-container.ui-public-swiper.pb-30.bookstore{padding-bottom:1.5rem;margin-top:1rem}
.step-4 .public-swiper-container [class*="swiper-btn-round"]{margin-top:-1.6rem}
.preview-popup-wrap.has-only-music .preview-popup-dialog{opacity:1}
.preview-popup-wrap.has-only-music .preview-controler-area{-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}
.preview-popup-wrap.has-only-music .preview-controler-area .drop-down-container{margin-left:15px;opacity:0}
.preview-popup-wrap.has-only-music .preview-controler-area .drop-down-btn{min-width:150px}
.step-4-swiper-popup01 .ui-play-pause-btn,.step-4-swiper-popup02 .ui-play-pause-btn,.step-4-swiper-popup03 .ui-play-pause-btn,.step-4-swiper-popup04 .ui-play-pause-btn,.step-4-swiper-popup05 .ui-play-pause-btn,.step-4-swiper-popup06 .ui-play-pause-btn{display:block!important}
}