@charset "euc-kr";

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

#only1_wrapper .web {
    font-family: 'Pretendard', sans-serif;
}

img {
    /*width: 100%;*/
    display: block;
    border: 0;
}

button, html [type=button], [type=reset], [type=submit] {
    -webkit-appearance: none;
}

button, select {
    text-transform: none;
}

button, input {
    overflow: hidden;
}

button:focus {
    outline: none;
}

a, div {
    -webkit-tap-highlight-color: transparent;
}

.web {
    min-width: 1300px;

}

.wrapper {
    position: relative;
}

.wrapper:before {
    content: "";
    display: block;
    padding-top: 100%;
}

.content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.con_wrap {
    width: 100%;
    margin: 0 auto;
}

section {
    width: 100%;
    overflow: hidden;
}

.con_wrap:before {
    content: "";
    display: block;
    background-color: #472992;
}

.mobile {
    max-width: 798px;
    margin: 0 auto;
}

h2 {
    text-align: center;
}

h2 img {
    display: inline-block;
    width: auto;
}

.embed_wrap {
    position: relative;
    max-width: 1920px;
    margin: 0 auto;
}

.embed_con {
    position: absolute;
    left: 0;
    right: 0;
    top: 24.4%;
    bottom: 0;
}

.embed_con .swiper-container.gallery-top {
    width: 41.7%;
    height: 60.9%; /* border: 4px solid #004dcb; */
}

.embed_wrap a.iframe {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 957px;
    height: 100%;
    margin: 0 auto;
}

.embed_con .swiper-container.gallery-top .swiper-slide:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%; /* border: 4px solid #004dcb; */
}

.embed_wrap iframe {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    max-width: 957px;
    height: 100%;
}

.embed_wrap .swiper-slide {
    background-repeat: no-repeat !important;
    background-size: 100% !important;
}

.swiper-button-prev,
.swiper-button-next {
    position: absolute;
    top: 29.2%;
    width: 2.5%;
    height: 10.8%;
    background: transparent;
    text-indent: -9999em;
    outline: none;
}

.w3-section .w3-button.prev,
.swiper-button-prev {
    left: 25%;
}

.w3-section .w3-button.next,
.swiper-button-next {
    right: 25%;
}

.page-wrap {
    position: relative;
}

.freeform_top_banner {
    position: fixed;
    right: 45px;
    top: 145px;
    z-index: 999;
}

.free-trial-apply {
    position: fixed;
    width: 351px;
    height: 635px;
    right: 40px;
    top: 140px;
    font-size: 0.7em;
    z-index: 999;
    overflow: hidden;
}

.bottom {
    background-color: #165fc3;
}

.bt_t {
    width: 71%;
    margin: 0 auto;
    margin-left: 14%;
    margin-bottom: 7.7%;
}

.bt_wrap {
    position: relative;
    background: #585e6b;
}

.bt_wrap .top {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 7%;
    display: block;
    height: 9%;
    text-indent: -9999em;
    transform: translateX(-50%);
}

.w1200 {
    max-width: 1200px;
    margin: 0 auto;
}

.w1200:after {
    content: "";
    display: block;
    clear: both;
}

.stamp {
    position: absolute;
    top: 56.3%;
    left: 53.5%;
    text-align: center;
    width: 25%;
}

.stamp img {
    display: inline;
    margin: 0 1px 2.5%;
    width: 23.3%;
}

.visual {
    position: relative;
    background: #44a1f3;
    text-align: center;
}

.visual .sec01 > img {
    display: inline-block;
    width: 100%;
}

.visual .con {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1200px;
    height: 100%;
    transform: translateX(-50%);
    z-index: 10;
}

.visual .con > img {
    position: absolute;
    zoom: 0.75;
}

.visual .visual_tit {
    top: 70px;
    left: -5px;
}

.visual .visual_img {
    top: 390px;
    left: -15px;
}

.visual .visual_info {
    bottom: 80px;
    left: 220px;
}

.section02 {
    background: #e7e9ff;
}

.section02 img {
    display: inline-block;
    width: 100%;
}

.section03 {
    background: linear-gradient(to bottom, #a4e6ff 0%, #fffaed 50%, #ffecba 100%);
}

.section03 img {
    display: inline-block;
    width: 100%;
}

.present {
    display: flex;
    align-items: center;
}

.present:first-child li:first-child {
    margin-right: 50px;
}

.present:first-child li:nth-child(2) {
    margin-top: 50px;
}

.present:nth-child(2) li:nth-child(2) {
    margin-right: 43px;
}

.present + .present {
    margin-top: 22px;
}

.btn_wrap {
    position: relative;
}

.btn_wrap .btn {
    position: absolute;
    top: 0;
    width: 27.3%;
    left: 50.5%;
    text-indent: -9999em;
}

.section04 {
    background: #f9f9fc;
}

.section04 h2 {
    padding: 105px 0 30px;
}

.sec04 {
    text-align: center;
}

.sec04 img {
    display: inline-block;
    width: 100%;
}

.section04_tab_wrap {
    width: 900px;
    height: 615px;
    position: absolute;
    top: 200px;
    left: 50%;
    transform: translateX(-50%);
}

.section04_tab_wrap .tab {
    position: absolute;
    width: 100%;
    display: flex;
}

.section04_tab_wrap .tab button {
    width: calc(100% / 3);
    height: 75px;
    background: transparent;
    text-indent: -9999em;
}

.tab_contents02 {

}

.tab_contents02 .gif_01 {
    position: absolute;
    top: 195px;
    left: 75px;
}

.tab_contents02 .gif_02 {
    position: absolute;
    bottom: 75px;
    left: 75px;

}

/*.tab_contents02 .video {*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*}*/

.tab_contents02 video {
    width: 305px;
    height: 160px;
    object-fit: cover;
}

.tab_contents03 .gif_01 {
    position: absolute;
    top: 195px;
    left: 75px;
    width: 305px;
    height: auto;
}

.tab_contents03 .gif_02 {
    position: absolute;
    bottom: 56px;
    left: 75px;
    width: 305px;
    height: auto;
}

.tab_contents03 > div > img {
    width: 100%;
    height: 170px;
    object-fit: cover;
}

.section05 {
    background: #eff2ff;
}

.section05 h2 {
    padding: 105px 0 60px;
}

.sec05 {
    background: url(images/img_section05.png) no-repeat center center / cover;
    padding: 0 0 160px;
}

.sec05 .qna_wrap {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    border-top: 3px solid #4a65f6;
}

.sec05 .qna_wrap > li {
    position: relative;
    border-top: 1px solid #222;
}

.sec05 .qna_wrap > li:last-child {
    border-bottom: 0;
}

.sec05 .qna_wrap > li.active .txt {
    border-bottom: none;
}

.sec05 .qna_wrap > li.active .txt::after {
    top: calc(50% - 5px);
    transition: all 0.5s ease;
    transform: rotate(-180deg);
}

.sec05 .qna_wrap > li.active .content {
    display: block;
}

.sec05 .qna_wrap > li .txt {
    position: relative;
    cursor: pointer;
    height: 92px;
    font-size: 28px;
    font-weight: 800;
    color: #222;
    line-height: 90px;
    padding-left: 100px;
    background: #fff url(images/q.png) 50px center no-repeat;
}

.sec05 .qna_wrap > li .txt::after {
    position: absolute;
    top: 50%;
    right: 23px;
    transform: translateY(-50%);
    width: 2.2%;
    height: 20%;
    transition: all 0.5s ease;
    background: url(images/icon_qna_down.png) 50% 50% no-repeat;
    background-size: 100% auto;
    content: "";
}

.sec05 .qna_wrap > li .answer {
    display: none;
    font-size: 28px;
    letter-spacing: -1px;
    background: #dfe5ff;
    box-sizing: border-box;
    padding: 40px 85px;
    color: #222;
    font-weight: 400;
}

.sec05 .qna_wrap > li .answer .point_color {
    color: #4a65f6;
    font-weight: 600;
}

.section06 {
    background: #136be9;
}

.section06 .sec06 > img {
    width: 100%;
}

/*.note_rolling {*/
/*    position: absolute;*/
/*    top: 20%;*/
/*    left: 0;*/
/*    right: 0;*/
/*    width: 780px;*/
/*    height: 35.5%;*/
/*    margin: 0 auto;*/
/*    overflow: hidden;*/
/*}*/

/*.note_list {*/
/*    width: 100%;*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    flex-wrap: wrap;*/
/*    gap: 4px;*/
/*}*/

/*.note_list li {*/
/*    width: calc(100% / 4 - 3px);*/
/*    height: 120px;*/
/*    border: 1px solid #ccc;*/
/*    overflow: hidden;*/
/*    background-size: auto 400%;*/
/*    background: url(images/img_section06_rolling.png) repeat-y;*/
/*    animation-name: moveSlideshow02;*/
/*    animation-fill-mode: both;*/
/*    animation-duration: 15s;*/
/*    animation-iteration-count: infinite;*/
/*    animation-timing-function: linear;*/
/*}*/


/*.note_list .note_list_01 {*/
/*    background-position: 0 0;*/
/*}*/

/*.note_list .note_list_02 {*/
/*    background-position: -300px 0;*/
/*}*/

/*.note_list .note_list_03 {*/
/*    background-position: -601px 0;*/
/*}*/

/*.note_list .note_list_04 {*/
/*    background-position: -902px 0;*/
/*}*/


/*@keyframes moveSlideshow02 {*/
/*    0% {*/
/*        background-position-y: 0;*/
/*    }*/
/*    100% {*/
/*        background-position-y: 100%;*/
/*    }*/
/*}*/

.note_rolling {
    position: absolute;
    top: 19.5%;
    left: 0;
    right: 0;
    width: 780px;
    height: 12%;
    margin: 0 auto;
    overflow: hidden;
}

.note_list {
    width: 100%;
    display: flex;
    flex-direction: column;
    animation-name: moveSlideshow;
    animation-fill-mode: both;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.note_list li {
    height: 50%;
}

.note_list li img {
    width: 100%;
    max-width: none;
    height: 100%;
}

@keyframes moveSlideshow {
    100% {
        transform: translateY(-50%);
    }
}

.note_interaction {
    width: 780px;
    position: absolute;
    top: 38.5%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    justify-content: space-between;
}

.note_interaction .interaction_01, .note_interaction .interaction_02 {
    width: calc(50% - 4px);
    height: 220px;
    border: 1px solid #ccc;
    object-fit: cover;
}

.note_images01 {
    width: 780px;
    position: absolute;
    top: 56.2%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    justify-content: space-between;
}

.note_images01 img {
    width: calc(50% - 4px);
    height: 220px;
    border: 1px solid #ccc;
}

.note_images02 {
    width: 780px;
    position: absolute;
    top: 50.5%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    justify-content: space-between;
}

.note_images02 img {
    width: calc(33.3333% - 5px);
    height: 220px;
    border: 1px solid #ccc;
}

.section07 {
    background: #308bda;
}

.section07 img {
    width: 100%;
}

.section08 {
    background: #eee;
}


.free_btn.sec08_btn01 {
    position: absolute;
    top: 72.5%;
    left: 37%;
    margin: 0 auto;
    width: 27%;
    font-size: 0;
    padding-top: 5%;
    line-height: 0;
}

.sec08_btn01::after {
    content: '';
    background: url(images/img_click.png) no-repeat 0 0/contain;
    width: 68px;
    height: 73px;
    position: absolute;
    bottom: -22%;
    right: -2.8%;
    animation: click 1s ease-in infinite alternate;
}

@keyframes click {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(10%, 10%);
    }
}


.section09 {

}


.btn_view {
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    background-color: transparent;
    width: 10%;
    height: 5%;
    text-indent: -9999px;
    font-size: 0;
}

.btn_view.sec05_btn01 {
    top: 65%;
    width: 250px;
    height: 4.5%;
    cursor: pointer;
    left: 48.7%;
    z-index: 50;
}

.btn_view.sec05_btn01.tab3 {
    top: 73%;
}

/*a.sec05_link {*/
/*    position: absolute;*/
/*    display: inline-block;*/
/*    top: 83.5%;*/
/*    left: 36.5%;*/
/*    width: 535px;*/
/*    height: 9%;*/
/*    cursor: pointer;*/
/*}*/

/*.sec05_link::after {*/
/*    content: '';*/
/*    background: url(images/img_hand.png) no-repeat;*/
/*    width: 141px;*/
/*    height: 135px;*/
/*    position: absolute;*/
/*    bottom: -50%;*/
/*    right: -10%;*/
/*    animation: click 1s ease-in infinite alternate;*/
/*}*/

.section10 {
    background: #4d4d4d;
}

.sec10 {
    max-width: 1920px;
    margin: 0 auto;
}

.sec10_btn {
    position: absolute;
    width: 34%;
    height: 14%;
    bottom: 43.1%;
    left: 33%;
    font-size: 0;
}


@keyframes blink-effect {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}


.info_box {
    position: absolute;
    bottom: 15%;
    left: 31.7%;
    height: 63px;
}

.info_box.active_tab3 {
    bottom: 8%;
}

.input_wrap {
    width: 700px;
    height: 100%;
    text-indent: -9999px;
    font-size: 0;
    display: -webkit-flex;
    display: flex;
    padding: 0 8% 0 0;
    background: url(images/input_wrap_bg.png) no-repeat 0 0 / cover;
}

.input_wrap .it {
    -webkit-flex: 1;
    flex: 1;
    background-color: transparent;
    border: 0;
    color: #666;
    font-size: 18px;
    padding: 0 100px 0 20px;
    height: 100%;
    font-weight: 500;
}

.input_wrap::after {
    content: '';
    background: url(images/img_click.png) no-repeat;
    width: 68px;
    height: 73px;
    position: absolute;
    bottom: -70%;
    right: -5%;
    animation: click 1s ease-in infinite alternate;
    zoom: 0.75;
}

.input_wrap .btn_view {
    left: auto;
    right: 0;
    width: 23%;
    height: 100%;
}

.checkbox_01 {
    position: relative;
    margin: 0 auto;
}

.checkbox_01 input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    margin: 0;
    padding: 0;
    width: 18px;
    height: 18px;
    overflow: hidden;
    clip: rect(0px, 0px, 0px, 0px);
}

.checkbox_01 input[type="checkbox"] + .label {
    position: relative;
    display: inline-block;
}

.checkbox_01 input[type="checkbox"] + .label .checked {
    display: none;
}

.checkbox_01 input[type="checkbox"]:checked + .label img {
    display: none;
}

.checkbox_01 input[type="checkbox"]:checked + .label img.checked {
    display: inline;
}

.sec04 .checkbox_01 {
    margin-top: 10px;
    text-align: left;
    zoom: 0.7;
}

.sec04 .checkbox_01 label {
    cursor: pointer;
}


/* ¹«·áüÇè ½Åû °úÁ¤ */
.process_wrap {
    background: #eee;
    padding-top: 100px;
}

.process_wrap strong {
    font-weight: 400;
    text-align: center;
    color: #2c2c2c;
    display: block;
    font-size: 48px;
}

.process_wrap strong span {
    font-weight: 700;
}

.process_li {
    margin-top: 33px;
    display: flex;
    justify-content: center;
}

.process_li li {
    text-align: center;
    position: relative;
}

.process_li li + li {
    margin-left: 156px;
}

.process_li li + li::before {
    content: '';
    position: absolute;
    left: -79px;
    top: 50%;
    transform: translate(0, -50%);
    background: url(images/process/process_arrow.png) no-repeat;
    width: 22px;
    height: 30px;
    display: block;
}

.process_li li div {
    height: 100px;
}

.process_li li p {
    margin-top: 12px;
    color: #2c2c2c;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 24px;
    font-weight: 600;
}

.process_wrap .btn_wrap {
    padding-bottom: 85px;
    width: 1140px;
    margin: 0 auto;
}

.process_btn {
    display: block;
    font-size: 0;
    width: 548px;
    margin: 50px auto 0;
    position: relative;
}

.process_btn::after {
    position: absolute;
    content: '';
    background: url(images/img_click.png) no-repeat 0 0 / contain;
    width: 68px;
    height: 73px;
    bottom: -15px;
    right: 0;
    animation: blink-effect 0.5s ease-in-out infinite alternate;
}

.notice_wrap {
    background: #585e6b;
}

.notice_box {
    width: 1140px;
    margin: 0 auto 45px;
    padding-top: 80px;
}

.notice_box > strong {
    background: url(images/process/notice_tit.png) no-repeat;
    width: 477px;
    height: 35px;
    display: block;
    font-size: 0;
    background-size: contain;
}

.notice_li {
    margin: 15px 0 0 50px;
}

.notice_li li {
    font-size: 18px;
    color: #c9c9c9;
}

.notice_li li + li {
    margin-top: 4px;
}

.notice_li li.noti_tit {
    font-weight: 700;
    margin-bottom: 20px;
    color: #5f5f5f;
}

.notice_li li span {
    margin: 0 5px 0 15px;
}

.notice_wrap .top_btn {
    width: 128px;
    height: 48px;
    display: block;
    background: #b1b1b1 url(images/process/top_btn.png) no-repeat center center;
    margin: 0 auto;
    font-size: 0;
}

@media screen and (max-width: 1850px) {
    .info_box {
        bottom: 8%;
    }
}

@media screen and (max-width: 1680px) {
    .visual .con > img {
        position: absolute;
        zoom: 0.5;
    }

    .visual .visual_tit {
        top: 100px;
        left: 20%;
    }

    .visual .visual_img {
        top: 450px;
        left: 20%;
    }

    .visual .visual_info {
        bottom: 160px;
        left: 30%;
    }

    .section04_tab_wrap, .info_box, .note_rolling, .note_interaction, .note_images01, .sec05 .qna_wrap {
        zoom: 0.75;
    }

    .info_box {
        bottom: 20%;
    }

    .info_box.active_tab3 {
        bottom: 12%;
    }

    .btn_view.sec05_btn01 {
        top: 60.5%;
        width: 190px;
    }

    .btn_view.sec05_btn01.tab3 {
        top: 68.5%;
    }
}