@charset="euc-kr"; @font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GmarketSansLight';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* °øÅë */
#wrapper {
    overflow: hidden;
    min-width: 1300px;
    width: auto;
    margin: 0 auto;
}

#wrapper > div > img {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

#wrapper .inner {
    position: relative;
    width: 1300px;
    margin: 0 auto;
}

/* visual */
.visual {
    position: relative;
    background: #8094c6;
}

#wrapper .visual .inner {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1300px;
    height: 100%;
    margin: 0 auto;
    padding-top: 154px;
    text-align: center;
}

#wrapper .visual .light {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

/* tit bar °øÅë */
.tit_bar {
    background: #006abb;
}

/* check */
.check {
    position: relative;
    background: linear-gradient(180deg, rgba(88,47,47,1) 0%, rgba(57,27,27,1) 100%);
    ; }

#wrapper .check .inner {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1200px;
    height: 100%;
}

.check .inner div {
    position: absolute;
}

.check .inner .arr {
    top: 469px;
    left: 461px;
    z-index: 10;
}

.check .inner .con {
    top: 308px;
    left: 520px;
}

/* prepare */
.prepare {
    position: relative;
    background-color: #fff;
}

#wrapper .prepare .inner {
    width:1200px;
    padding:100px 0;
}

.prepare .inner .con {
    display: flex;
    gap: 30px;
    margin-top:50px;
}

/* contents_01 */
.contents_01 {
    position: relative;
    overflow: hidden;
}

.contents_01 .con {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1200px;
    height: 100%;
    margin: 0 auto;
}

.contents_01 .con .book_slide {
    position: absolute;
    top: 0;
    width: 235px;
    height: 100%;
}

.contents_01 .con .book_slide.book_slide01 {
    right: 550px;
}

.contents_01 .con .book_slide.book_slide02 {
    right: 275px;
}

.contents_01 .con .book_slide.book_slide03 {
    right: 0;
}

.contents_01 .con .book_slide.book_slide01 .rolling .roller.original {
    animation: 60s linear 0s infinite normal forwards running rollingTop1;
}

.contents_01 .con .book_slide.book_slide01 .rolling .roller.clone {
    animation: 60s linear 0s infinite normal none running rollingTop2;
}

.contents_01 .con .book_slide.book_slide02 .rolling .roller.original {
    animation: 60s linear 0s infinite normal forwards running rollingBottom1;
}

.contents_01 .con .book_slide.book_slide02 .rolling .roller.clone {
    animation: 60s linear 0s infinite normal none running rollingBottom2;
}

.contents_01 .con .book_slide.book_slide03 .rolling .roller.original {
    animation: 60s linear 0s infinite normal forwards running rollingTop3;
}

.contents_01 .con .book_slide.book_slide03 .rolling .roller.clone {
    animation: 60s linear 0s infinite normal none running rollingTop4;
}

/* contents_02 */
.contents_02 {
    padding: 115px 0 100px;
    background: #F5F8FF;
}

.contents_02 .con {
    width: 1200px;
    margin: 50px auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

/* contents_03 */
.contents_03 {
    padding: 115px 0 100px;
    background: #fff;
}

.contents_03 .con {
    width: 1200px;
    margin: 50px auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.contents_03 .con a{
    display:block;
    margin-top:-32px;
}

/* contents_04 */
.contents_04 {
    padding: 115px 0 100px;
    background: #F5F8FF;
}

.contents_04 .con {
    width: 1200px;
    margin: 50px auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

/* service */
.service {
    padding: 115px 0 100px;
}

.service .con {
    width: 1200px;
    margin: 50px auto 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.service .con .service_box {
    width: calc(100% / 2 - 15px);
}

/* lineup */
.lineup {
    padding: 100px 0 80px;
    background: #F5F8FF;
}

#wrapper .lineup .inner{
    width:1200px;
    text-align:center;
}

.banner {
    background: #121530;
}

/* lectureList */
#lectureList {
    width: 1200px;
    margin: 0 auto;
}

/* ÇÏ´Ü¹è³Ê Á¦°Å */
.fix_all_btm_type_banner {
    display: none;
}

/* ------------------------------ animation css ¡é ---------------------------------------------
	animation:60s linear 0s infinite normal forwards running rollingTop1;
	animation:60s linear 0s infinite normal forwards running rollingTop2;
	animation:click 1s ease-in infinite alternate;
	animation:blinker 1s ease-in infinite alternate;
------------------------------------------------------------------------------------------ */
/* ÇÑÂÊÀ¸·Î Èå¸£´Â ¾Ö´Ï¸ÞÀÌ¼Ç(top:À§·Î, right:¿À¸¥ÂÊÀ¸·Î) */
@keyframes rollingTop1 {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-100%);
    }

    50.01% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes rollingTop2 {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-200%);
    }
}

@keyframes rollingTop3 {
    0% {
        transform: translateY(-50%);
    }

    50% {
        transform: translateY(-150%);
    }

    50.01% {
        transform: translateY(50%);
    }

    100% {
        transform: translateY(-50%);
    }
}

@keyframes rollingTop4 {
    0% {
        transform: translateY(-50%);
    }

    100% {
        transform: translateY(-250%);
    }
}

@keyframes rollingBottom1 {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(100%);
    }

    50.01% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes rollingBottom2 {
    0% {
        transform: translateY(-200%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes rollingRight1 {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(100%);
    }

    50.01% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

@keyframes rollingRight2 {
    0% {
        transform: translateX(-200%);
    }

    100% {
        transform: translateX(0);
    }
}

/* ¼Õ°¡¶ô Å¬¸¯ À¯µµ ¾Ö´Ï¸ÞÀÌ¼Ç */
@keyframes click {
    0% {
        transform: translate(0,0);
    }

    100% {
        transform: translate(10%,10%);
    }
}

/* À§ ¾Æ·¡ ¶°´Ù´Ï´Â ¾Ö´Ï¸ÞÀÌ¼Ç */
@keyframes bounce {
    50% {
        transform: translate(10px,-10px)
    }
}

@keyframes rotate {
    100% {
        transform: rotate(1turn);
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(3000px);
    }

    100% {
        opacity: 1;
        transform: translateX(-50%);
    }
}

/* anchor */
.anchor {
    position: fixed !important;
    right: 0;
    top: 300px;
    z-index: 15;
    /*display: none;*/
}

.anchor ul {
    position: relative;
}

.anchor ul li a {
    display: block;
    height: 82px;
    width: 155px;
    background-image: url(img/floating_off.png);
    background-repeat: no-repeat;
}

.anchor ul li:first-of-type a, .anchor ul li:last-of-type a {
    height: 82px;
}

.anchor ul li a.on {
    background-image: url(img/floating_on.png);
}

.anchor ul li:nth-of-type(1) a {
    background-position: 0 0;
}

.anchor ul li:nth-of-type(2) a {
    background-position: 0 -82px;
}

.anchor ul li:nth-of-type(3) a {
    background-position: 0 -164px;
}

.anchor ul li:nth-of-type(4) a {
    background-position: 0 -246px;
}
