
/* =========================
    common
========================= */
.curriculumWrap *[class^="cont0"] {padding:100px 0 130px;text-align:center}

.curriculumWrap .s_list li {text-align:left;line-height:1.2;color:#777;font-size:15px;}
.curriculumWrap .s_list li:last-child {margin-bottom:0}

.in {width:1200px;margin:0 auto;box-sizing:border-box;height:100%}
.in02 {width:1000px;margin:0 auto;box-sizing:border-box;height:100%}
.in03 {width:1300px;margin:0 auto;box-sizing:border-box;height:100%}

/* =========================
    visual
========================= */
.curriculumWrap {position:relative;overflow:hidden;margin-top:-20px}
.curriculumWrap .visual {position:relative;overflow:hidden;box-sizing:border-box}
.curriculumWrap .visual.type01 {overflow:initial;height:850px}
.curriculumWrap .visual.type02 {overflow:initial;height:950px}
.curriculumWrap .visual .info-box {z-index:1;position:relative;padding:220px 0 150px;text-align:center}
.curriculumWrap .visual .info-box > p {font-size:22px;color:#333333;text-align: left;margin-top:50px;}

.curriculumWrap .visual .visual-bg {position:absolute;top:0;left:0;width:100%;height:1100px}
.curriculumWrap .visual.type01 .visual-bg {height:850px}
.curriculumWrap .visual.type02 .visual-bg {height:950px}
.curriculumWrap .visual .visual-bg img {width:100%;height:100%}
.curriculumWrap .visual .bg {position:relative;height:100%;background-size:cover}

/* =========================
    contents
========================= */
.curriculumWrap .cont-wrap {position:relative}
.curriculumWrap .cont01 {background:#f4f4f4}
.curriculumWrap .cont03 {padding:100px 0;background:#e8e8e8}
.curriculumWrap .cont03 .in {width:1300px}

/* review */
/* .curriculumWrap .review-wrap {position: relative;width:100%;margin-top:180px;padding-bottom: 200px} */
.curriculumWrap .review-wrap {position: relative;width:100%}
.curriculumWrap .review-wrap::after {display: block;position:absolute;bottom:0px;left:0;width:100%;height:180px;content:"";background:#e8e8e8;z-index: 0}
.curriculumWrap .review-swiper {position:absolute;top:-130px;left:50%;width:1060px;height:303px;margin-left:-530px;z-index: 1}
.curriculumWrap .owl-theme.review-swiper .owl-nav.disabled + .owl-dots {position:absolute;top:30px;right:55px;margin-top:8px}
.curriculumWrap .owl-theme.review-swiper .owl-dots .owl-dot span {width:12px;height:12px;margin:0 0 0 6px}
.curriculumWrap .owl-theme.review-swiper .owl-dots .owl-dot.active span, .curriculumWrap .owl-theme.review-swiper .owl-dots .owl-dot:hover span {background:#fff17b}

/* curriculumBox */
.curriculumWrap .curriculumBox .tab{display:flex;overflow:hidden;margin:0 0 28px 0}
.curriculumWrap .curriculumBox .tab li{flex-grow:1;flex-basis:0;text-align:center;height:97px;line-height:94px;background:#adadad;color:#fff;float:left;margin:0 0 0 1px}
.curriculumWrap .curriculumBox .tab li:first-child{margin:0 0 0 0}
.curriculumWrap .curriculumBox .tab li a{color:#e8acc7;display:block;font-size:29px;padding:0 5px;text-decoration:none;position:relative;height:100%;outline:none}
.curriculumWrap .curriculumBox .tab li a:before{content:"";position:absolute;left:0;top:0;width:16px;height:17px;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bg_tab_left.gif") center top no-repeat}
.curriculumWrap .curriculumBox .tab li a:after{content:"";position:absolute;right:0;top:0;width:16px;height:17px;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bg_tab_right.gif") center top no-repeat}
.curriculumWrap .curriculumBox .tab li:first-child a:before{display:none}
.curriculumWrap .curriculumBox .tab li:last-child a:after{display:none}
.curriculumWrap .curriculumBox .tab li.on{background:#30917a}
.curriculumWrap .curriculumBox .tab li.on a{color:#fff;font-weight:700}
.curriculumWrap .curriculumBox .tab li.on a:before{content:"";position:absolute;left:0;top:0;width:16px;height:17px;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bg_tab_left_on.gif") center top no-repeat}
.curriculumWrap .curriculumBox .tab li.on a:after{content:"";position:absolute;right:0;top:0;width:16px;height:17px;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bg_tab_right_on.gif") center top no-repeat}

.curriculumWrap .tabCon {display: flex;padding:22px 0 22px}
.curriculumWrap .tabCon .listBox{margin:0;width:220px;overflow:hidden;letter-spacing:-1px}
.curriculumWrap .tabCon .listBox .title{font-size:20px;color:#30917a;margin:0 0 5px 0;font-weight:700;padding:0 0 0 9px;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bullet_tab_list.png") left 12px no-repeat;letter-spacing:-2px}
.curriculumWrap .tabCon .listBox .tabConList{display:none}

.curriculumWrap .tabCon .listBox .teacherList{overflow:hidden;display:flex;flex-direction:column}
.curriculumWrap .tabCon .listBox .tabConList.on {display:flex;flex-direction:column;align-items:center}
.curriculumWrap .tabCon .listBox .teacherList:first-child {padding-top:18px}
.curriculumWrap .tabCon .listBox .teacherList li {position:relative;text-align:center;/* margin-top:13px*/}
.curriculumWrap .tabCon .listBox .teacherList li:last-child {margin-bottom:10px}
.curriculumWrap .tabCon .listBox .teacherList li a {display:inline-block;min-width:80px;padding:0 7px;height:32px;line-height:30px;font-size:18px;color:#2c2d2d;outline:none}
.curriculumWrap .tabCon .listBox .teacherList li.on a{border-radius:50px;background:#cd9f64;color:#fff}
.curriculumWrap .tabCon .listBox .teacherList li.ico-new a {position:relative}
.curriculumWrap .tabCon .listBox .teacherList li.ico-new a:after {content:'';width:7px;height:7px;background:url("https://russeldata.megastudy.net/campus/images/russel/info/curriculum/ic_new.gif") no-repeat 0 0;position:absolute;top:9px;right:10px}

.curriculumWrap .tabCon .videoBox {position:relative;width:calc(100% - 220px);/* padding:16px 0;*/border-left:1px solid #82868c}
.curriculumWrap .tabCon .videoClipBox {position:relative}
.curriculumWrap .tabCon .videoClipBox .title{text-align:center;font-size:40px;line-height:50px;color:#2c2d2d;font-weight:700;letter-spacing:-2px}
.curriculumWrap .tabCon .videoClipBox .title span{color:#2b8670}
.curriculumWrap .tabCon .videoClipBox .videoClip {width:600px;height:386px;overflow:hidden;margin:45px 0 56px 465px}
.curriculumWrap .tabCon .videoClipBox .videoClip a {display:block;height:100%;padding:70px 0 0 0;box-sizing:border-box;background-size:cover!important;background:url("https://russeldata.megastudy.net/campus/images/russel/russel_jg/info/curriculum/bg_play.gif") 0 0 no-repeat;text-align:center;color:#ccb292;font-size:36px;text-decoration:none}
.curriculumWrap .tabCon .videoClipBox .teacher {position:absolute;left:0;bottom:-30px}
.curriculumWrap .tabCon .videoClipBox .teacher.ico-newin:after {content:'';background:url("https://russeldata.megastudy.net/campus/images/russel/info/curriculum/ico-newin.png") 0 0 no-repeat;width:118px;height:118px;position:absolute;top:0;left:30px}
.curriculumWrap .tabCon .videoClipBox .teacher .pic{width:430px}
.curriculumWrap .tabCon .videoClipBox .teacher .alpha {position:absolute;left:1px;bottom:-29px;width:464px}
.curriculumWrap .tabCon .videoClipBox .btnbox {position:absolute;bottom:0;left:320px;display:flex;flex-direction:column}
.curriculumWrap .tabCon .videoClipBox .btnbox a {margin-bottom:6px}
.curriculumWrap .tabCon .videoClipBox .info {position:absolute;right:163px;bottom:-35px;color:#ce1515;font-size:12px}

.curriculumWrap .tbl-wrap {position: relative;display:flex}
.curriculumWrap .tbl-wrap .in {display:none;position:relative;margin:0 auto;padding:0 20px;box-sizing:border-box}
.curriculumWrap .tbl-wrap .in.on {display:block}

.curriculumWrap .bt-banner {display:flex;justify-content:center;padding-top:100px;}
.curriculumWrap .bt-banner ul li {background-color:#e1e1e1;border-radius:20px;text-align: center;width:590px;height:260px;display:flex;flex-direction: column;align-items: center;justify-content: center;}

.curriculumWrap .bt-banner ul li p {color:#666666;font-size:19px;line-height:1.2;}
.curriculumWrap .bt-banner ul li p strong {margin-top:10px;color:#cf2e81;font-weight:900;font-size:36px;display:block;}
.curriculumWrap .bt-banner ul li a {background-color:#323232;border-radius:50px;color:#fff;padding:7px 50px 7px 40px;position:relative;margin-top:25px;font-size:16px;font-weight:bold;}
.curriculumWrap .bt-banner ul li a:hover {text-decoration: none;}
.curriculumWrap .bt-banner ul li a:after {content:'';width:7px;height:7px;border-top:2px solid #fff;border-right:2px solid #fff;position:absolute;top:50%;right:33px;transform:translateY(-50%) rotate(45deg);}

/* =========================
    ¸ñµ¿
========================= */
.curriculumWrap .visual .info-box {position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:center;padding-left:150px;}
.curriculumWrap .visual .v-ico {display:inline-block;animation:bounce-in-top 1.1s both;position:absolute;top:80px;right:130px;}
.curriculumWrap .visual .tit {display:inline-block;margin-bottom:57px}
.curriculumWrap .visual .txt {text-align:left;letter-spacing:-1.5px;font-size:22px;color:#434343}
.curriculumWrap .d-list {margin-left:-60px;}
.curriculumWrap .visual .quick {position:absolute;top:50%;right:0;width:182px;transform:translateY(-50%);text-align:left;border-left:2px solid #cf2e81;background:#FFF; z-index: 2;}
.curriculumWrap .visual .quick .q-ban {position:relative;display:block;padding:21px 17px;border-top:1px solid #ddd}
.curriculumWrap .quick .q-ban p{display:flex;flex-direction:column;letter-spacing:-1.4px;line-height:1.2;font-size:14px;font-weight:500;color:#cf2e81}
.curriculumWrap .quick .q-ban strong {margin-top:10px;font-weight:bold;font-size:16px;letter-spacing:-1.4px;color:#111}
.curriculumWrap .quick .q-ban:first-child a:before {content: '';position:absolute;right:15px;bottom:33px;height:6px;transform:translateY(50%) rotate(-45deg);border-right:1px solid #a7a7a7;border-bottom:1px solid #a7a7a7}
.curriculumWrap .quick .q-ban:first-child a:after {content: '';position:absolute;right:15px;bottom:28px;height:6px;transform:translateY(50%) rotate(45deg);border-right:1px solid #a7a7a7;border-top:1px solid #a7a7a7}

.curriculumWrap .quick .q-ban .q-btn {position:absolute;left:0;bottom:0;display:flex;width:100%;text-align:center;background:#eee}
.curriculumWrap .quick .q-ban .q-btn a {position:relative;width:50%;height:26px;line-height:26px;font-size:14px;letter-spacing:-1.4px;font-weight:500}
.curriculumWrap .quick .q-ban .q-btn a:before {content: '';position:absolute;top:5px;right:15px;height:6px;transform:translateY(50%) rotate(-45deg);border-right:1px solid #a7a7a7;border-bottom:1px solid #a7a7a7}
.curriculumWrap .quick .q-ban .q-btn a:after {content: '';position:absolute;right:15px;bottom:9px;height:6px;transform:translateY(50%) rotate(45deg);border-right:1px solid #a7a7a7;border-top:1px solid #a7a7a7}
.curriculumWrap .quick .q-ban .q-btn a:first-child {border-right:1px solid #FFf}

.curriculumWrap .cont-wrap {text-align:center}
.curriculumWrap .cont01 {padding:100px 0 130px;background:#fff4ec}
.curriculumWrap .cont03 {padding:100px 0 0 0;background:#f2f2f2}
.curriculumWrap .cont03 .in {width:1200px}

.curriculumWrap .tab {display:flex;justify-content:center;align-items:center;margin: 0 !important}
.curriculumWrap .tab li {position: relative;width: 100%;height:80px !important;margin:0;line-height:80px !important;cursor:pointer;background:#cf2e81 !important;cursor:default;}
.curriculumWrap .cont03 .curriculumBox .tab li {cursor:default;}
.curriculumWrap .tab li:first-child {border-top-left-radius:20px}
.curriculumWrap .tab li:last-child {border-top-right-radius:20px}
.curriculumWrap .tab li a {color:#e8acc7;font-size:22px !important;font-weight:bold;letter-spacing:-1.5px}
.curriculumWrap .tab li a:hover {text-decoration: none;}
.curriculumWrap .cont03 .curriculumBox .tab li.on a {cursor:default;}
.curriculumWrap .tab li.on a {display:inline-block;color:#FFF;background:#cf2e81;cursor:default;}
.curriculumWrap .tab li.on a:after, .curriculumWrap .tab li a::before, .curriculumWrap .tab li a:after {display: none}
/* .curriculumWrap .tab li.on::before {content: '';z-index:1;position:absolute;bottom:0;left:47%;display:block;border-top:14px solid transparent;border-right:14px solid transparent;border-bottom:14px solid #FFF;border-left:14px solid transparent} */
.curriculumWrap .cont03 .curriculumBox .tab li.on::before {display:none;}
.curriculumWrap .cont-wrap .tab-cont {display:none;padding:72px 78px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;background:#FFF}
.curriculumWrap .cont-wrap .tab-cont.on {display:block}

.curriculumWrap .tab-cont .con {display:flex;margin-bottom:40px}
.curriculumWrap .tab-cont .con .grade {display:flex;flex-direction:column;justify-content:center;max-width:139px;width:100%;margin-right:6px;letter-spacing:-1.5px;color:#3a3a3a;font-weight:bold;font-size:22px;border-radius:20px;background:#dbdbdb}
.curriculumWrap .tab-cont .con .grade strong {font-weight:bold;color:#804ccb}
.curriculumWrap .tab-cont .con .grade.type {background:#ffe7e8}
.curriculumWrap .tab-cont .con .grade.type strong {color:#ce5959}
.curriculumWrap .tab-cont .con .grade.type01 {background:#f5eeff}
.curriculumWrap .tab-cont .con .grade.type01 strong {color:#804ccb}
.curriculumWrap .tab-cont .con .grade.type02 {background:#defeff}
.curriculumWrap .tab-cont .con .grade.type02 strong {color:#26819b}
.curriculumWrap .tab-cont .con .grade.type03 {background:#fff3de}
.curriculumWrap .tab-cont .con .grade.type03 strong {color:#9b6026}
.curriculumWrap .tab-cont .con .grade.type04 {background:#deffdf}
.curriculumWrap .tab-cont .con .grade.type05 {background:#c3fdc5}

.curriculumWrap .tab-cont .t-box {display:flex;flex-wrap:wrap}
.curriculumWrap .tab-cont .t-box li {position:relative;width:175px;height:175px;margin-right:6px;border-radius:15px;background:#eee}
.curriculumWrap .tab-cont .t-box li:nth-child(5n) {margin-right:0}
.curriculumWrap .tab-cont .t-box li:nth-child(n+6) {margin-top:6px}
.curriculumWrap .tab-cont .t-box .name {position: absolute; margin-top:20px;margin-left:20px;line-height:1.4;letter-spacing:-1.5px;text-align:left;font-size:20px;color:#5d5d5d;font-weight:500;z-index:1;}
.curriculumWrap .tab-cont .t-box .name strong {color:#3a3a3a;font-size:20px;font-weight:bold}
.curriculumWrap .tab-cont .t-box .img {position:absolute;right:0;bottom:0;text-align:right; border-radius: 16px; overflow: hidden;}
.curriculumWrap .tab-cont .t-box *[class^="flag-"] {position:absolute;bottom:10px;left:-20px; min-width:100px;padding:10px;border-radius:15px;color:#fff;font-size:16px;font-weight:bold;display:block;z-index: 2;box-sizing:border-box;line-height:1.2;animation: float 2s ease-in-out infinite;height:58px;display:flex;justify-content: center;align-items: center;}

@keyframes float {
    0%, 100% {
        transform: translateY(0); 
    }
    50% {
        transform: translateY(10px); 
    }
}
.curriculumWrap .tab-cont .t-box *[class^="flag-"]:before {content:'';background-image:url("https://russeldata.megastudy.net/campus/images/russel/russel/info/curriculum_go12/ico_tail_blue.png");width:16px;height:18px;position:absolute;top:-15px;right:15px;}
.curriculumWrap .tab-cont .t-box .flag-blue {background-color:#1b5bc6;}
.curriculumWrap .tab-cont .t-box .flag-green {background-color:#61b382}
.curriculumWrap .tab-cont .t-box .flag-green:before {background-image:url("https://russeldata.megastudy.net/campus/images/russel/russel/info/curriculum_go12/ico_tail_green.png");}
.curriculumWrap .tab-cont .t-box .flag-pink {background-color:#821bda}
.curriculumWrap .tab-cont .t-box .flag-pink:before {background-image:url("https://russeldata.megastudy.net/campus/images/russel/russel/info/curriculum_go12/ico_tail_bora.png");}
.curriculumWrap .tab-cont .t-box .flag-purple {background-color:#571bc6}
.curriculumWrap .tab-cont .t-box .flag-purple:before {background-image:url("https://russeldata.megastudy.net/campus/images/russel/russel/info/curriculum_go12/ico_tail_purple.png");}

/* OT ¿µ»ó È®ÀÎÇÏ±â */
.curriculumWrap .cont03 .cont-btn {position:relative;display:inline-block;width:350px;height:50px;margin-bottom:100px;line-height:50px;color:#FFF;font-size:20px;font-weight:bold;letter-spacing:-1.5px;border-radius:10px;background:#323232}
.curriculumWrap .cont03 .cont-btn::before {content: '';position:absolute;top:10px;right:89px;height:10px;transform:translateY(50%) rotate(-45deg);border-right:2px solid #FFF;border-bottom:1px solid #FFF}
.curriculumWrap .cont03 .cont-btn::after {content: '';position:absolute;top:18px;right:89px;height:10px;transform:translateY(50%) rotate(45deg);border-right:2px solid #FFF;border-top:1px solid #FFF}

/* curriculumBox */
/* .curriculumWrap .curriculumBox {padding:0 0 70px} */
.curriculumWrap .tabCon {padding:60px 0 77px;border-radius:0 0 20px 20px; background:#FFF}
.curriculumWrap .tabCon .listBox .title {position:relative;margin:0 0 5px 0 !important;color:#cf2e81;background:none}
.curriculumWrap .tabCon .listBox .title:before {content:'';position:absolute;top:13px;left:-5px;width:4px;height:4px;border-radius:50%;background:#cf2e81}
.curriculumWrap .tabCon .listBox .teacherList:first-child {padding-top: 0}
.curriculumWrap .tabCon .listBox .teacherList li a {height:28px;line-height:26px}
.curriculumWrap .tabCon .listBox .teacherList li.on a {background:#f7ab10}

.curriculumWrap .tabCon .videoClipBox .teacher {bottom:0}
.curriculumWrap .tabCon .videoClipBox .btnbox {position:absolute;top:70px;left:330px;display:flex;flex-direction:row}
.curriculumWrap .tabCon .videoClipBox .btnbox a {position:sticky!important;padding:0 25px 0 15px;height:30px;line-height:30px;letter-spacing:-1px;text-decoration:none;color:#FFF;border-radius:5px;background:#757575}
.curriculumWrap .tabCon .videoClipBox .btnbox a:before {content: '';position:absolute;top:6px;right:10px;height:6px;transform:translateY(50%) rotate(-45deg);border-right:1px solid #FFF;border-bottom:1px solid #FFF}
.curriculumWrap .tabCon .videoClipBox .btnbox a:after {content: '';position:absolute;top:11px;right:10px;height:6px;transform:translateY(50%) rotate(45deg);border-right:1px solid #FFF;border-top:1px solid #FFF}
.curriculumWrap .tabCon .videoClipBox .videoClip {position:relative;z-index:1;margin:45px 0 0 330px}
.curriculumWrap .tabCon .videoClipBox .title {position:relative;top:-15px;left:34%;width:54%;text-align:left;font-size:24px;line-height:1.4}
.curriculumWrap .tabCon .videoClipBox .btnbox .btnReview {padding:0 35px 0 27px}

.curriculumWrap .bt-banner {padding-bottom:130px;background:#f2f2f2}

/* =========================
    animation
========================= */
/* @keyframes cursor {0% {opacity:0} 100% {opacity:1}} */

@keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
                transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
                animation-timing-function: ease-in;
        opacity: 0;
    }
    38% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
                animation-timing-function: ease-out;
        opacity: 1;
    }
    55% {
        -webkit-transform: translateY(-65px);
                transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
                animation-timing-function: ease-in;
    }
    72% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
                animation-timing-function: ease-out;
    }
    81% {
        -webkit-transform: translateY(-28px);
                transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
                animation-timing-function: ease-in;
    }
    90% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
                animation-timing-function: ease-out;
    }
    95% {
        -webkit-transform: translateY(-8px);
                transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
                animation-timing-function: ease-in;
    }
    100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
                animation-timing-function: ease-out;
    }
}

@keyframes fadeIN {
    0% {opacity:0}
    100% {opacity:1}
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    100% {
        opacity: 1;
        transform: translateZ(0);
    }
}