@charset "UTF-8";

#header {background: transparent; box-shadow: none; position: fixed;}

#header .logo-area .logo {display: none;}
#header .logo-area .logo-white {display: block;}

#header .logo-area2 .logo path {fill: var(--white);}

#header .gnb .ul-main-menu>.item .main-menu {color: var(--white);}

#header :is(.btn-login, .btn-logout) {color: var(--gray5);}
#header.shrink :is(.btn-login, .btn-logout) {color: var(--gray40);}

#header.shrink {background: var(--white); box-shadow: var(--shadow);}

#header.shrink .logo-area .logo {display: block;}
#header.shrink .logo-area .logo-white {display: none;}

#header.shrink .logo-area2 .logo path {fill: #1C0C48;}

#header.shrink .gnb .ul-main-menu>.item .main-menu {color: var(--gray80);}

#header .btn-m-menu {color: var(--white);}
#header.shrink .btn-m-menu {color: var(--gray80);}


.modal {height: 750px; overflow-x: hidden; overflow-y: auto;}


/* .visual {background-image: url('../img/main/visual_con2.png'), url('../img/main/visual_con1.png'), url('../img/main/visual_bg.jpg'); background-blend-mode: normal, multiply, normal;} */
.pt-0 {padding-top: 0 !important;}
.visual {position: relative;}
.visual1 {background-image: url('../img/main/visual_bg.jpg')}
.visual1 .visual-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#tsparticles {width: 100%; height: 100%; position: fixed; top: 0; left: 0;}
.visual1 .visual-bg img {object-fit: cover; object-position: center; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.visual1 .visual-bg .con1 {mix-blend-mode: multiply;}
.visual1 .visual-bg .con2 {mix-blend-mode: normal;}
.visual-swiper {position: relative; width: 100%; height: 937px;}
.ul-visual .item {position: relative; width: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 208px;}
.visual-swiper .swiper-pagination {text-align: left; position: static; margin-top: 50px;}
.visual-swiper .swiper-pagination-bullet {width: 10px; height: 10px; background: transparent; border: 1px solid var(--white);}
.visual-swiper .swiper-pagination-bullet-active {background: var(--white);}
.visual .inner {position: relative;}
.visual .title_area {color: var(--white); margin-bottom: 80px;}
.visual .title_area .txt {font-size: 1.563em; font-weight: 300; margin-bottom: 40px;}
.visual .title_area .txt span {font-size: 1.600em;}
.visual .title_area .txt .tint {color: #FFEC26; font-weight: 600;}
.visual .title_area .tit {line-height: 1.3; font-weight: 700;}
.visual .title_area .tit p:first-child {font-size: 2.250em;}
.visual .title_area .tit .tint {font-size: 4.063em; color: #FFEC26;}
.visual .img_area img {width: 100%; max-width: 1014px;}
.visual .borad {width: 100%; display: -webkit-flex; display: flex; justify-content: start; align-items: start; -webkit-flex-wrap: wrap; flex-wrap: wrap; position: absolute; bottom: 0; left: 0; z-index: 1;}
.visual .borad .box {width: 50%; background: rgba(0,0,0,0.66); color: var(--white);}
.visual .borad .box .cate {padding: 24px 30px; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--white);}
.visual .borad .box .cate span {font-weight: 500; font-size: 1.438em;}
.visual .borad .box .cate i {font-size: 1.250em;}
.visual .borad .box .post .item {padding: 26px 30px; font-weight: 300; font-size: 1.188em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1;}
.visual .borad .box .post .item a {color: var(--white);}
.post-swiper {width: 100%; height: 74px;}


.btn-register {width: 100%; max-width: 460px; height: 80px; padding: 16px 30px; border-radius: 999px; background: var(--white); font-weight: 700; font-size: 2em;}

.btn-register span{    
    color: var(--highlight);    
	background: linear-gradient(to right, #5D25FE, #D019FF);
    -moz-background-clip: text; -webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
}


.contents>.inner>.title1 {line-height: 1.3;}


.tutor {padding: 140px 0 180px; position: relative;}
.lightViolet {background: #F6F4FC;}
.tutor .title1 {margin-bottom: 50px;}

.ul-icon_area {width: 100%; display: -webkit-flex; display: flex; justify-content: start; align-items: start; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 38px;}
.ul-icon_area .item {width: 25%; text-align: center; border-right: var(--border-solid); padding: 12px 20px;}
.ul-icon_area .item:last-child {border-right: 0;}

.tutor-wrap {width: 100%; position: relative;}

.multiple-swiper {width: 85%; max-width: 1020px; position: relative;}

.video-swiper {width: 100%; max-width: 1020px; height: auto; max-height: 574px; padding-bottom: 56.25%; margin: 0; position: relative;}
.ul-video {position: absolute; top: 0; left: 0;}
.ul-video .video {width: 100%; height: 100%;}
.ul-video iframe, .ul-video video {width: 100%; height: 100%;}
.profile_area .profile-img {
    width: 196px; height: 196px;
    border: 5px solid var(--highlight); border-radius: 50%;
    box-shadow: 0px 0px 20px rgba(93, 37, 254, 0.5);
    position: absolute; top: -98px; left: 50%;
    transform: translateX(-50%);
    background-color: var(--white); background-repeat: no-repeat; background-size: cover;
}
.profile_area .profile-txt {width: 360px; padding: 146px 40px 50px; border-radius: 20px; background: var(--white); text-align: center; box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.08);}
.profile_area .profile-txt p:nth-of-type(1) {font-size: 1.125em;}
.profile_area .profile-txt .name {font-weight: 700; font-size: 1.625em; color: rgba(51,51,51,1);}

.shadow-box {overflow: visible; overflow-x: clip; overflow-y: visible; position: relative; top: 0; left: 50%; transform: translateX(-50%); width: 1180px; margin-top: 148px;}
.tutor-swiper {overflow: visible;}
.tutor-swiper .swiper-slide {opacity: 0.3; transition: opacity .7s;}
.tutor-swiper .swiper-slide-active {opacity: 1;}

.tutor-swiper .swiper-button-prev {left: 377.5px;}
.tutor-swiper .swiper-button-next {right: 377.5px;}

/* .tutor .btn_area {width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; margin-top: 20px;} */
.tutor .btn_area {width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; margin-top: 20px; margin-left: auto;}
.btn_area .btn-more {display: -webkit-flex; display: flex; justify-content: start; align-items: center;}
.btn_area .btn-more span {font-weight: 500; font-size: 1.500em; color: rgba(93,37,254,1); margin-right: 20px;}
.btn_area .btn-more i {font-size: 16px; color: rgba(93,37,254,1);}


.learning-system {padding: 120px 0 220px;}
.learning-system .bg {width: 100%; max-width: 1393px; margin: 0 auto; margin-top: 100px; position: relative;}
.learning-system .bg-system-svg {position: absolute; width: 100%; max-width: 1393px; top: 0; left: 50%; transform: translateX(-50%); z-index: -1;}
.learning-system .system-area {width: 79%; max-width: 1100px; margin: 0 auto;}
.learning-system .system-area .ul-system>.item {position: relative;}
.learning-system .system-area .ul-system .step01 {padding-top: 70px; margin-bottom: 70px;}
.learning-system .system-area .ul-system .step02 {padding-top: 133px; margin-bottom: 140px;}
.learning-system .system-area .ul-system .step03 {padding-top: 133px; margin-bottom: 104px;}
.learning-system .system-area .ul-system .step04 {padding-top: 133px; margin-bottom: 100px;}
.learning-system .system-area .ul-system .step05 {padding-top: 133px;}

.learning-system .system-area .ul-system>.item .img_step {position: absolute; height: 120px;}
.learning-system .system-area .ul-system>.item .img_step img {display: block; width: 100%; height: 100%; object-fit: contain;}
.learning-system .system-area .ul-system .step01 .img_step {top: 37px; left: -220px;}
.learning-system .system-area .ul-system .step02 .img_step {top: 100px; right: -220px;}
.learning-system .system-area .ul-system .step03 .img_step {top: -33px; left: -220px;}
.learning-system .system-area .ul-system .step04 .img_step {top: 100px; right: -220px;}
.learning-system .system-area .ul-system .step05 .img_step {top: 100px; left: -220px;}

.learning-system .system-area .ul-system .step01>.box {display: -webkit-flex; display: flex; justify-content: space-between; align-items: end;}
.learning-system .system-area .ul-system .step03>.box {position: relative;}
.learning-system .system-area .ul-system>.item>.box .txt {font-weight: 300; font-size: 1.250em; color: rgba(61,61,61,1); margin-bottom: 60px;}
.learning-system .system-area .ul-system .step01>.box .txt {text-align: left; margin-bottom: 0;}
.learning-system .system-area .ul-system .step02>.box .txt {text-align: right;}
.learning-system .system-area .ul-system .step03>.box .txt {text-align: left;}
.learning-system .system-area .ul-system .step04>.box .txt {text-align: right;}
.learning-system .system-area .ul-system .step05>.box .txt {text-align: left;}
.learning-system .system-area .ul-system .step03>.box .tit+.txt {margin-top: 0; margin-bottom: 40px;}
.learning-system .system-area .ul-system .step03>.box .slash {display: inline-block; width: 1px; height: 100px; background: #DFDFDF; transform: rotate(20deg); margin: 0 10px;}

.learning-system .system-area .ul-system>.item>.box .title1 {line-height: 1.174;}
.learning-system .system-area .ul-system .step01>.box .title1 {text-align: left; color: #FF7561;}
.learning-system .system-area .ul-system .step02>.box .title1 {text-align: right; color: #FFA05C;}
.learning-system .system-area .ul-system .step03>.box .title1 {text-align: left; color: #FFDD3C;}
.learning-system .system-area .ul-system .step03>.box .title1 span {font-weight: 300; font-size: 0.522em; color: #333333; margin-left: 8px;}
.learning-system .system-area .ul-system .step04>.box .title1 {text-align: right; color: #53B97D;}
.learning-system .system-area .ul-system .step05>.box .title1 {text-align: left; color: #7298E9;}

.learning-system .system-area .ul-system>.item .btn-experience {width: 100%; max-width: 460px; height: 80px; padding: 13px 30px; text-align: center; font-family: Pretendard; font-weight: 700; font-size: 2em; border-radius: 999px; display: -webkit-flex; display: flex; justify-content: center; align-items: center;}

.learning-system .system-area .ul-system .step03>.box .txt_area {width: calc(57% - 30px);}
.learning-system .system-area .ul-system .step03>.box>img {position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 43%; max-width: 470px;}

.experience1>.tit {width: 100%; height: 44px; line-height: 44px; background: #9976FE; box-shadow: 0 0 10px var(--highlight); font-weight: 600; font-size: 1.250em; color: var(--white); border-radius: 20px 20px 0 0; text-align: center;}
.experience1>.title1 {text-align: right;}
.experience1>.text1 {text-align: right; margin-bottom: 60px;}

.experience1 .speaking {width: 100%; border: var(--border-solid); background: var(--white); display: -webkit-flex; display: flex; justify-content: start; align-items: start; box-shadow: 0 0 14px rgba(0, 0, 0, .10); border-radius: 0 0 20px 20px;}
.speaking-swiper .player .pagination {width: auto;}
.speaking-swiper .ul-script {width: 100%; padding: 20px 50px; background: var(--white)AF5; border-bottom: var(--border-solid);}
.ul-script .script {color: #A6A6A6;}
.speaking-swiper .script {min-height: 100px;}
.speaking-swiper .ul-script .script .english {font-weight: 700; font-size: 1.750em; margin-bottom: 6px; line-height: 1.2;}
.ul-script .active .english {color: rgba(61,61,61,1);}
.ul-script .script .english .highlight {color: rgba(254,95,117,1);}
.ul-script .script .korean {font-weight: 300; font-size: 1.375em; color: #515151;}
.speaking-swiper .ul-script .active .korean {line-height: 1.2;}

.recorder {width: 100%;}
.recorder .recorder_area {width: 100%; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center;}
.recorder .recorder_area i {font-size: 36px;}
.recorder .recorder_area .center {width: 16%; text-align: center;}
.recorder .recorder_area .right {width: 72%;}
.recorder .native {padding: 40px 60px 0 30px;}
.recorder .student {padding: 0 60px 0 30px;}

.score {width: 100%; position: relative;}
.score .box {position: relative; width: 100%; height: 120px; border: 4px solid transparent; text-align: center; display: -webkit-flex; display: flex; justify-content: center; align-items: center;}
.score .box .icon_area {width: 76px; height: 76px; border-radius: 50%; background: var(--white); text-align: center; position: absolute; top: -38px; left: 50%; transform: translateX(-50%);}
.score .box .icon_area i {font-size: 60px; line-height: 76px;}
.score .box .score-txt {font-family: 'Orbitron'; font-weight: 900; font-size: 1.875em; letter-spacing: -0.2px; margin-right: 50px;}
.score .box .score-num {font-family: futura-pt; font-weight: 700; font-size: 2.5em; color: rgba(61,61,61,1);}

.score .pass {border-color: #00B8F4;}
.score .pass .icon_area i {color: #00B8F4;}
.score .pass .score-txt {color: rgba(0,184,244,1);}

.score .fail {border-color: #f11150;}
.score .fail .icon_area i {color: #f11150;}
.score .fail .score-txt {color: #f11150;}

.speaking-player {height: 80px; border: 0; border-top: var(--border-solid);}

.sp_check {position: absolute; top: -22px;}
.wave-css {position: absolute; width: 1px; height: 100%; z-index: 10; background: red; left: 0%;}
.waveCSS-arrow {position: absolute; bottom: -7px; width: 0; height: 0; left: 50%; transform: translateX(-50%); border-color: transparent transparent red transparent; border-style: solid; border-width: 7px;}
.me-wave-css {position: absolute; width: 1px; height: 100%; z-index: 10; background: blue; left: 0%;}
.me-waveCSS-arrow {position: absolute; bottom: -7px; width: 0; height: 0; left: 50%; transform: translateX(-50%); border-color: transparent transparent blue transparent; border-style: solid; border-width: 7px;}

.learning-system .system-area .ul-system .step04 .ul-img {display: -webkit-flex; display: flex; justify-content: space-between; align-items: start;}
.learning-system .system-area .ul-system .step04 .ul-img li {width: calc((100% - 60px)/2); position: relative;}
.learning-system .system-area .ul-system .step04 .ul-img .txt {font-weight: 300; font-size: 1.250em; color: rgba(61,61,61,1); margin-bottom: 12px;}
.learning-system .system-area .ul-system .step04 .ul-img .txt .tit {color: var(--highlight); font-weight: 600;}
.learning-system .system-area .ul-system .step04 .ul-img .shadow-img {width: 100%; max-width: 520px; display: block; box-shadow: 0 0 10px rgba(0, 0, 0, 0.06);}
.learning-system .system-area .ul-system .step04 .ul-img .shadow-icon {width: 36.2%; max-width: 188px; position: absolute; bottom: 6px; right: -18.08%;}

.experience3>.tit {width: 100%; height: 74px; line-height: 74px; background: #9976FE; box-shadow: 0 0 10px var(--highlight); font-weight: 600; font-size: 1.250em; color: var(--white); border-radius: 20px 20px 0 0; text-align: center;}
.experience3>.tit .beta {display: inline-block; font-weight: 500; height: 50px; vertical-align: middle; margin-left: 20px;}
.experience3>.tit .beta img {display: block; width: 100%; height: 100%; object-fit: contain;}
.experience3 .writing {width: 100%; border: var(--border-solid); background: var(--white); box-shadow: 0 0 14px rgba(0, 0, 0, .10); border-radius: 0 0 20px 20px; overflow: hidden;}
.experience3 .writing .topic {display: -webkit-flex; display: flex; justify-content: start; align-items: center; border-bottom: var(--border-solid);}
.experience3 .writing .topic .tit {text-align: center; font-weight: 700; font-size: 1.25em; color: #333333; padding: 15px 40px;}
.experience3 .writing .topic .txt {font-weight: 700; font-size: 1.25em; color: rgba(61,61,61,1); padding: 15px 40px; border-left: var(--border-solid);}
.experience3 .writing .essay_area {padding: 50px 70px; background: var(--white)AF5;}
.experience3 .writing .essay {position: relative;}
.experience3 .writing .essay .top {color: #3D3D3D; display: -webkit-flex; display: flex; justify-content: space-between; align-items: end; margin-bottom: 20px;}
.experience3 .writing .essay .top>.tit {text-align: left; font-weight: 700; font-size: 1.5em;}
.experience3 .writing .essay .top .word>span {margin-right: 40px;}
.experience3 .writing .essay .top .word>span:last-child {margin-right: 0;}
.experience3 .writing .essay .top .word .tit {text-align: right; font-weight: 600; font-size: 1.125em;}
.experience3 .writing .essay .top .word .txt {text-align: right; font-weight: 300; font-size: 1.125em;}
.count {position: absolute; bottom: 88px; right: 30px; font-size: 0.75em; color: #707070;}
.count .txt {text-align: right; font-weight: 300; font-size: 1.125em;}
.count .real-count {text-align: right; font-weight: 600; font-size: 1.125em; margin-left: 10px;}

.experience3 .writing .essay textarea {
    width: 100%; min-height: 226px; max-height: 226px; line-height: 56px; border-radius: 6px 6px 0 0; border-bottom: 0;
    background-color: var(--white); 
    background-image: url('../img/textarea.png'), linear-gradient(to right, var(--white), var(--white)); 
    background-position: center top; 
    background-size: 100% 56px; 
    background-attachment: local; 
    resize: none; 
}
.experience3 .writing .essay textarea:focus {border-color: var(--highlight);}
.experience3 .writing .essay textarea:focus + .btn_area {border-color: var(--highlight);}
.experience3 .writing .essay .btn_area {text-align: center; background: var(--white); border: var(--border-solid); border-top: 0; border-radius: 0 0 6px 6px;}
.experience3 .writing .essay .btn_area .btn-correct {margin-top: 40px; margin-bottom: 30px;}
.experience3 .writing .essay .loading {width: 50px; margin: 0 auto;}
.experience3 .writing .essay .loading img {display: block; width: 100%;}

.experience3 .writing .correct {margin-top: 80px;}
.ai_correction {
    border: var(--border-solid); border-bottom: 0; border-radius: 6px 6px 0 0; padding: 0 30px; padding-bottom: 2px; font-size: 1.125em; width: 100%; min-height: 56px; line-height: 56px; 
    background-color: var(--white); 
    background-image: url('../img/textarea.png'), linear-gradient(to right, var(--white), var(--white)); 
    background-position: center top; 
    background-size: 100% 56px; 
    background-attachment: local; 
    position: relative; white-space: pre-wrap; 
}

.experience3 .writing .correct .writing-player {height: 48px; padding: 0 30px; border: var(--border-solid); border-top: 0; border-radius: 0 0 6px 6px;}
.experience3 .writing .correct .writing-player .btn3 {height: 40px; padding: 7px 0; display: -webkit-flex; display: flex; justify-content: center; align-items: center; margin-right: 30px;}
.experience3 .writing .correct .writing-player .btn3:last-child {margin-right: 0;}
.experience3 .writing .correct .writing-player .btn3 span {margin-right: 10px;}
.experience3 .writing .correct .btn_area {display: -webkit-flex; display: flex; justify-content: center; align-items: center; background: transparent; border: 0; border-radius: 0; margin-top: 30px;}
.experience3 .writing .correct .btn2 {width: 200px; height: 40px; padding: 7px 0; border-radius: 999px; display: -webkit-flex; display: flex; justify-content: center; align-items: center; margin-right: 20px; font-size: 1.125em;}
.experience3 .writing .correct .btn2:last-child {margin-right: 0;}
/* .experience3 .writing .correct .btn2 span {margin-right: 10px;} */
.experience3 .writing .correct .btn-view {border-color: transparent; background: var(--highlight); font-weight: 600; color: var(--white);}
/* .experience3 .writing .correct .btn-view span {margin-right: 0;} */

.feedback {position: relative; margin-top: 40px;}
.feedback .tit {font-weight: 600; font-size: 1.5em;}
.feedback .ul-feedback {font-size: 1.125em;}
.feedback .btn-feedback {width: 140px; height: 40px; padding: 7px 0; border-radius: 999px; display: -webkit-flex; display: flex; justify-content: center; align-items: center; border-color: #dfdfdf; font-weight: 500; font-size: 1.125em; color: #707070; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.feedback .btn-feedback span {margin-right: 0;}


.videoStudy {width: 100%; padding: 180px 0 140px; background-image: url('../img/main/bg-videoStudy.png'), linear-gradient(to right, #F6F4FC, #F6F4FC); background-repeat: no-repeat; background-position: center top, center bottom; background-size: contain, 100% 82%;}
.videoStudy .title1 {line-height: 1.3;}
.videoStudy .text1 {margin-bottom: 80px;}
.videoBox {border: var(--border-solid); box-shadow: 0 0 14px rgb(0 0 0 / 10%); border-radius: 20px; overflow: hidden;}

.videoStudy .top2 {width: 100%; height: 64px; padding: 20px 40px; /* border: var(--border-solid); border-top: 2px solid #333333; */ background: var(--white); display: -webkit-flex; display: flex; justify-content: space-between; align-items: center;}
.videoStudy .top2 .cate {width: 140px; font-weight: 700; font-size: 1.25em; color: rgba(93,37,254,1); margin-right: 30px;}
.videoStudy .top2 .txt {font-weight: 200; font-size: 1.125em;}
.videoStudy .top2 .ul-btn_area {display: -webkit-flex; display: flex; justify-content: start; align-items: center;}
.videoStudy .top2 .ul-btn_area .item {margin-right: 30px;}
.videoStudy .top2 .ul-btn_area .item:last-child {margin-right: 0;}
.videoStudy .top2 .ul-btn_area .item .btn3 {font-size: 1.125em; display: -webkit-flex; display: flex; justify-content: start; align-items: center;}
.videoStudy .top2 .ul-btn_area .item .btn3 span {margin: 10px;}
.videoStudy .top2 .ul-btn_area .item .btn3 i {font-size: 14px;}

.videoStudy .video_wrap {width: 100%; display: -webkit-flex; display: flex; justify-content: start; align-items: start; -webkit-flex-wrap: wrap; flex-wrap: wrap; /* border: var(--border-solid); */ border-top: var(--border-solid);}
.videoStudy .play_wrap {width: 640px;}
.videoStudy .video_area {width: 100%; padding-bottom: 56.25%; position: relative;}
.videoStudy .video_area iframe {width: 100%; height: 100%; position: absolute; top: 0; bottom: 0;}
.videoStudy .video_area .btn-expand {width: 40px; height: 40px; color: var(--white); position: absolute; bottom: 0; right: 0;}
.videoStudy .video_area .btn-expand i {font-size: 22px;}
.videoStudy .video_area .timeline_area {position: absolute; bottom: -30px; left: 0; width: 100%; display: -webkit-flex; display: flex; flex-direction: column; z-index: 1;}
/*
.listening-player {height: 110px; padding-top: 30px; border: 0;}
.listening-player .pagination {width: auto;}
.listening-player .pagination, .listening-player .play_area, .listening-player .swiper-prev, .listening-player .swiper-next {top: calc(50% + 15px);}
*/
.listening-player {border: 0;}

.script_wrap {width: calc(100% - 640px); height: 440px; padding: 40px 50px; background: var(--white)AF5; border-left: var(--border-solid); overflow-y: auto;}
.normalScroll {overflow-y: auto;}
.script_wrap .ul-script .script .english {font-weight: 400; font-size: 1.375em; line-height: 1.7;}
.videoStudy .video_wrap .bottom {width: 100%;}
.ul-bottom {padding: 20px; width: 100%; display: -webkit-flex; display: flex; justify-content: start; align-items: start; -webkit-flex-wrap: wrap; flex-wrap: wrap; background: var(--white); border-top: var(--border-solid);}
.ul-bottom .item {width: 188px; margin-right: 20px; margin-bottom: 20px;}
.ul-bottom .item:last-child {margin-right: 0;}
.ul-bottom .item .btn2 {width: 100%; height: 40px; padding: 7px 10px; border-radius: 999px;}
.ul-bottom .item .btn2 span {margin-right: 10px;}
.ul-bottom .item .btn2 span:last-child {margin-right: 0;}

.videoStudy .btn_area {width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; margin-top: 20px; margin-left: auto;}


.curriculum {width: 100%; max-width: 1636px; padding: 140px 0 130px; margin: 0 auto; position: relative;}
.curriculum .text1 {margin-bottom: 100px;}
.curriculum .swiper-pagination {position: static;}
.ul-curriculum {display: -webkit-flex; display: flex; justify-content: center; align-items: start; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 80px;}
.ul-curriculum .item {width: calc((100% - 100px)/6); height: 160px; border-radius: 20px; color: var(--white); display: inline-block; margin-right: 20px; margin-bottom: 20px; background-size: cover;}
.ul-curriculum .item:last-child {margin-right: 0;}
.ul-curriculum .item .btn-curriculum {width: 100%; height: 100%; border-radius: 20px; text-align: center; font-size: 1.875em; color: var(--white); background-color: rgba(0,0,0,.6);}
.ul-curriculum .item .btn-curriculum:hover, .ul-curriculum .item .btn-curriculum:active, .ul-curriculum .item .btn-curriculum:focus {background-color: rgba(93,37,254,.6);}
.ul-curriculum .item.active .btn-curriculum {background-color: rgba(93,37,254,.6);}

.ul-curriculum .item1 {background-image: url('../img/main/curriculum-item01.jpg'); margin-left: 20px;}

.ul-curriculum .item2 {background-image: url('../img/main/curriculum-item02.jpg');}

.ul-curriculum .item3 {background-image: url('../img/main/curriculum-item03.jpg');}

.ul-curriculum .item4 {background-image: url('../img/main/curriculum-item04.jpg');}

.ul-curriculum .item5 {background-image: url('../img/main/curriculum-item05.jpg');}

.ul-curriculum .item6 {background-image: url('../img/main/curriculum-item06.jpg');}

.ul-curriculum .item7 {background-image: url('../img/main/curriculum-item07.jpg');}

.ul-curriculum .item8 {background-image: url('../img/main/curriculum-item08.jpg');}

.ul-curriculum .item9 {background-image: url('../img/main/curriculum-item09.jpg');}

.ul-curriculum .item10 {background-image: url('../img/main/curriculum-item10.jpg');}

.ul-curriculum .item11 {background-image: url('../img/main/curriculum-item11.jpg');}

.curriculum .inner {position: relative;}

.curriculum-swiper {padding: 0 100px;}
.curriculum-swiper .swiper-button-prev {left: 0;}
.curriculum-swiper .swiper-button-next {right: 0;}
.curriculum-swiper .swiper-button-next:after, .curriculum-swiper .swiper-button-prev:after {font-size: 50px;}
.course_area {display: -webkit-flex; display: flex; justify-content: space-between; align-items: start;}
.course_area .txt_area {margin-right: 40px;}
.course_area .curriculum_txt {display: -webkit-flex; display: flex; justify-content: start; align-items: center; margin-bottom: 54px;}
.course_area .lv {display: inline-block; min-width: 136px; height: 46px; padding: 5px 30px; border-radius: 999px; text-align: center; font-weight: 600; font-size: 1.5em; background: var(--highlight); color: rgba(255,255,255,1); margin-right: 48px;}
.course_area .course {font-weight: 500; font-size: 2.875em; color: #333333;}
.course_area .title2 {text-align: left; line-height: 1.5;}
.course_area .text1 {text-align: left; margin-bottom: 0;}
.course_area .img_area {width: 180px;}
.course_area .img_area img {display: block; width: 100%;}

.curriculum .btn_area {width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; margin-top: 20px; margin-left: auto;}


.review {padding: 80px 0; position: relative;}
.review::before {display: inline-block; content: ''; width: calc((((100% + 394px) - 210px)/4) - 197px); height: 100%; background: linear-gradient(to right, #F6F4FC, rgba(246, 244, 252, 0)); position: absolute; top: 0; left: 0; z-index: 2;}
.review::after {display: inline-block; content: ''; width: calc((((100% + 394px) - 210px)/4) - 197px); height: 100%; background: linear-gradient(to left, #F6F4FC, rgba(246, 244, 252, 0)); position: absolute; top: 0; right: 0; z-index: 2;}
.review .title1 {margin-bottom: 60px;}

.review-swiper {width: calc(100% + 394px); margin-bottom: 80px; position: relative; left: 50%; transform: translateX(-50%);}
.review-swiper .item {width: calc((100% - 210px)/4); height: 500px; margin-right: 70px; background: var(--white); border-radius: 6px; position: relative;}
.review-swiper .item1 {padding: 30px 40px;}
.review-swiper .item4 {padding: 60px 40px 40px; display: -webkit-flex; display: flex; flex-direction: column;}
.review-swiper .item3 {padding: 0; display: grid; grid-template-columns: 38% 62%; grid-template-rows: 17.4% 57.4% 25.2%;}
.review-swiper .item2 {padding: 0; display: -webkit-flex; display: flex; flex-direction: column;}


.review-swiper .item .tit {width: calc(100% - 140px); font-weight: 700; font-size: 1.375em; color: rgba(61,61,61,1); text-align: left; margin-bottom: 24px;}
.review-swiper .item1 .tit {max-width: 200px; height: 3em;}
.review-swiper .item .name {font-size: 1.063em; color: rgba(93,37,254,1);}
.review-swiper .item1 .name {width: calc(100% - 110px);}
.review-swiper .item1 .img_area {width: 110px; height: 110px; border-radius: 50%; background-size: cover; background-repeat: no-repeat; background-position: center; position: absolute; top: 30px; right: 40px;}
.review-swiper .item1 .img_area img {width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.review-swiper .item1 .line {width: 100%; height: 1px; background: #CFCFCF; margin: 16px 0 30px;}
.review-txt {line-height: 1.875; font-weight: 500; font-size: 1.063em;}
.review-swiper .item1 .review-txt {width: 100%; height: 15em; -webkit-line-clamp: 8;}

.review-swiper .item4 .tit {width: 100%; height: 1.5em; margin-bottom: 10px; -webkit-line-clamp: 1; text-align: center; order: 2;}
.review-swiper .item4 .name {margin-bottom: 30px; text-align: center; order: 3;}
.review-swiper .item4 .img_area {width: 66px; height: 50px; border-radius: 0; background-size: auto; background-repeat: no-repeat; background-position: center; margin: 0 auto; margin-bottom: 40px; position: static; order: 1; flex-shrink: 0;}
.review-swiper .item4 .img_area img {border-radius: 0; object-fit: unset;}
.review-swiper .item4 .line {display: none;}
.review-swiper .item4 .review-txt {width: 100%; height: 11.25em; -webkit-line-clamp: 6; order: 4;}

.review-swiper .item3 .tit {grid-column-start: 2; grid-column-end: 3; grid-row-start: 1; grid-row-end: 2; width: 100%; height: 1.5em; margin: 30px 0 24px; padding: 0 40px; -webkit-line-clamp: 1; text-align: left;}
.review-swiper .item3 .name {grid-column-start: 2; grid-column-end: 3; grid-row-start: 3; grid-row-end: 4; width: 100%; margin: 80px 0 30px; padding: 0 40px;}
.review-swiper .item3 .img_area {grid-column-start: 1; grid-column-end: 2; grid-row-start: 1; grid-row-end: 4; border-radius: 6px 0 0 6px; background-size: cover; background-repeat: no-repeat; background-position: center;}
.review-swiper .item3 .img_area img {border-radius: 6px 0 0 6px;}
.review-swiper .item3 .line {display: none;}
.review-swiper .item3 .review-txt {grid-column-start: 2; grid-column-end: 3; grid-row-start: 2; grid-row-end: 3; width: 100%; height: 16.875em; padding: 0 40px; -webkit-line-clamp: 9;}

.review-swiper .item2 .tit {width: 100%; height: auto; margin: 30px 0 24px; padding: 0 40px; -webkit-line-clamp: 1; text-align: left; order: 2;}
.review-swiper .item2 .name {width: 100%; padding: 0 40px 30px; margin-top: 40px; order: 4;}
.review-swiper .item2 .img_area {width: 100%; height: 200px; border-radius: 6px 6px 0 0; background-size: cover; background-repeat: no-repeat; background-position: center; position: static; order: 1;}
.review-swiper .item2 .img_area img {border-radius: 6px 6px 0 0;}
.review-swiper .item2 .line {display: none;}
.review-swiper .item2 .review-txt {width: 100%; height: 7.5em; padding: 0 40px; -webkit-line-clamp: 4; order: 3;}

.review-swiper .swiper-button-prev {left: calc(((100% - 210px)/4) + 25.625px);}
.review-swiper .swiper-button-next {right: calc(((100% - 210px)/4) + 25.625px);}
.review-swiper .swiper-button-next:after, .review-swiper .swiper-button-prev:after {font-size: 30px;}

.review .btn_area {text-align: center;}
.review .btn-register2 {background: var(--highlight); color: var(--white); margin: 0 auto;}


.prize {padding: 100px 0 120px;}
.prize-swiper::before {display: block; content: ''; width: 82px; height: 100%; background: var(--white); position: absolute; top: 0; left: 0; z-index: 2;}
.prize-swiper::after {display: block; content: ''; width: 82px; height: 100%; background: var(--white); position: absolute; top: 0; right: 0; z-index: 2;}
.prize .title1 {margin-bottom: 60px;}

.prize-swiper {padding: 0 82px; margin-bottom: 80px;}
.ul-prize {position: relative;}
.prize-swiper .swiper-button-prev {left: 0;}
.prize-swiper .swiper-button-next {right: 0;}
.prize-swiper .swiper-button-next:after, .prize-swiper .swiper-button-prev:after {font-size: 50px;}
.prize-swiper .item img {display: block; width: 100%; max-width: 325px;}

.prize .btn_area .btn-info {width: 100%; max-width: 460px; height: 80px; padding: 16px 30px; border-radius: 999px; font-weight: 700; font-size: 2em; display: -webkit-flex; display: flex; justify-content: center; align-items: center; margin: 0 auto;}

.darkGray {background: #1E1E1E;}
.laurel {padding: 94px 50px;}
.laurel .txt_wrap {display: -webkit-flex; display: flex; justify-content: center; align-items: center;}
.laurel .txt_wrap::before {display: block; content: ''; width: 115px; height: 212px; background-image: url('../img/main/laurel_left.png'); background-size: contain; background-repeat: no-repeat; background-position: left top;}
.laurel .txt_wrap::after {display: block; content: ''; width: 115px; height: 212px; background-image: url('../img/main/laurel_right.png'); background-size: contain; background-repeat: no-repeat; background-position: right top;}
.laurel .txt_area {color: var(--white); font-size: 2.875em; text-align: center;}
.laurel .txt_area .tint {font-weight: 700; color: #E9C77A;}


#fp-nav ul {position: relative;}
#fp-nav ul::before {display: block; content: ''; width: 1px; height: 180px; background: #c2c2c2; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#fp-nav ul li, .fp-slidesNav ul li {width: 15px; height: 15px; margin: 20px;}
#fp-nav ul li a span, .fp-slidesNav ul li a span {width: 7px; height: 7px; margin: 0; background: #c2c2c2; transform: translate(-50%, -50%);}
#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span {width: 12px; height: 12px; margin: 0;}
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span {width: 7px; height: 7px; margin: 0; background: var(--highlight);}
#fp-nav ul li a.active span::after, #fp-nav ul li:hover a.active span::after, .fp-slidesNav ul li a.active span::after, .fp-slidesNav ul li:hover a.active span::after {display: block; content: ''; width: 15px; height: 15px; border: 1px solid var(--highlight); border-radius: 50%; position: absolute; top: -4px; left: -4px;}
.fp-sr-only::after {display: none;}
#fp-nav ul li .fp-tooltip {color: #c2c2c2; font-size: 1.188em; font-family: Pretendard; opacity: 1; width: auto; top: 50%; transform: translateY(-50%);}
#fp-nav ul li:hover .fp-tooltip {color: #c2c2c2;}
#fp-nav.fp-show-active a.active + .fp-tooltip {color: var(--highlight);}

#fp-nav ul li:nth-last-child(-n+3) {display: none;}





@media screen and (max-width:1632px) {
    .curriculum {padding: 140px 50px 130px;}
}

@media screen and (max-width:1540px) {
    .learning-system {padding: 120px 50px;}
    .learning-system .system-area {width: 90%;}

    .learning-system .system-area .ul-system .step01 {padding-top: 57px; margin-bottom: 57px;}
    .learning-system .system-area .ul-system .step02 {padding-top: 112px; margin-bottom: 134px;}
    .learning-system .system-area .ul-system .step03 {padding-top: 112px; margin-bottom: 100px;}
    .learning-system .system-area .ul-system .step04 {padding-top: 112px; margin-bottom: 94px;}
    .learning-system .system-area .ul-system .step05 {padding-top: 112px;}

    .learning-system .system-area .ul-system>.item>.box .title1 {display: -webkit-flex; display: flex; align-items: center;}
    .learning-system .system-area .ul-system .step01>.box .title1 {justify-content: start;}
    .learning-system .system-area .ul-system .step02>.box .title1 {justify-content: end; flex-direction: row-reverse;}
    .learning-system .system-area .ul-system .step03>.box .title1 {justify-content: start;}
    .learning-system .system-area .ul-system .step04>.box .title1 {justify-content: end; flex-direction: row-reverse;}
    .learning-system .system-area .ul-system .step05>.box .title1 {justify-content: start;}

    .learning-system .system-area .ul-system>.item .img_step {position: static; width: 120px; height: 80px;}
    .learning-system .system-area .ul-system .step01 .img_step {margin-right: 20px;}
    .learning-system .system-area .ul-system .step02 .img_step {margin-left: 20px;}
    .learning-system .system-area .ul-system .step03 .img_step {margin-right: 20px;}
    .learning-system .system-area .ul-system .step04 .img_step {margin-left: 20px;}
    .learning-system .system-area .ul-system .step05 .img_step {margin-right: 20px;}
}

@media screen and (max-width:1440px) {
    .learning-system .system-area .ul-system .step01 {padding-top: 52px; margin-bottom: 52px;}
    .learning-system .system-area .ul-system .step02 {padding-top: 106px; margin-bottom: 100px;}
    .learning-system .system-area .ul-system .step03 {padding-top: 106px; margin-bottom: 86px;}
    .learning-system .system-area .ul-system .step04 {padding-top: 106px; margin-bottom: 70px;}
    .learning-system .system-area .ul-system .step05 {padding-top: 106px;}
}

@media screen and (min-width:1201px) {
    .ul-bottom .item:nth-child(5n) {margin-right: 0;}
    .ul-bottom .item:nth-last-child(-n+5) {margin-bottom: 0;}
}

@media screen and (max-width:1200px){
    .player {height: 64px;}
    .player .pagination {left: 40px;}
    .player .swiper-prev, .player .swiper-next {width: 40px; height: 40px;}
    .player .swiper-prev {right: 96px;}
    .player .swiper-next {right: 40px;}

    .ul-visual .item {padding: 0 50px; padding-top: 208px;}

    .tutor {padding: 140px 50px 180px;}

    .learning-system .system-area .ul-system .step01 {padding-top: 35px; margin-bottom: 35px;}
    .learning-system .system-area .ul-system .step02 {padding-top: 48px; margin-bottom: 22px;}
    .learning-system .system-area .ul-system .step03 {padding-top: 78px; margin-bottom: 54px;}
    .learning-system .system-area .ul-system .step04 {padding-top: 68px; margin-bottom: 36px;}
    .learning-system .system-area .ul-system .step05 {padding-top: 70px;}

    .learning-system .system-area .ul-system>.item>.box .title1 {margin-bottom: 20px;}
    .learning-system .system-area .ul-system>.item>.box .txt {margin-bottom: 40px;}
    .learning-system .system-area .ul-system .step01>.box .txt {margin-bottom: 0;}

    .experience1>.title1 {text-align: left;}
    .experience1>.text1 {text-align: left; margin-bottom: 40px;}

    .recorder .native {padding: 40px 30px 0 30px;}
    .recorder .student {padding: 0 30px;}
    .speaking-player .play_area .speak {width: 40px; height: 40px; font-size: 26px;}

    .experience2 {margin-bottom: 100px;}
    .experience2 .text1 {margin-bottom: 40px;}
    .experience2 img {width: 380px;}
    .experience2 .txt_area {width: 100%;}

    .experience3 .writing .correct .bottom {-webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .experience3 .writing .correct .writing-player {margin-bottom: 20px;}

    .videoStudy {padding: 180px 50px 140px;}
    .videoStudy .play_wrap {width: 500px;}
    .script_wrap {width: calc(100% - 500px); height: 345px; padding: 20px 30px;}

    .ul-curriculum .item .btn-curriculum {font-size: 1.5em;}

    .review-swiper .item3 .name {margin: 50px 0 30px;}

    .review-swiper .item2 .img_area {height: 150px;}

    .prize {padding: 100px 50px 120px;}
}

@media screen and (min-width:993px){

}

@media screen and (max-width:992px){
    /* .section {padding-top: 80px !important;}
    .pt-0 {padding-top: 0 !important;} */

    .ul-visual .item {padding: 0 50px; padding-top: 124px;}
    .btn-register {max-width: 350px; height: auto;}
    .post-swiper {height: 68px;}

    .tutor {padding: 90px 50px 130px;}

    .learning-system {padding: 100px 50px;}
    .learning-system .bg {margin-top: 60px;}
    .learning-system .bg-system-svg {display: none;}

    .learning-system .system-area {width: 100%;}

    .learning-system .system-area .ul-system>.item {padding-top: 0; margin-bottom: 80px;}
    .learning-system .system-area .ul-system>.item:last-child {margin-bottom: 0;}

    .learning-system .system-area .ul-system .step01>.box .txt_area {margin-right: 30px;}

    .learning-system .system-area .ul-system .step02>.box .title1 {justify-content: start; flex-direction: row;}
    .learning-system .system-area .ul-system .step04>.box .title1 {justify-content: start; flex-direction: row;}

    .learning-system .system-area .ul-system>.item .img_step {width: 81px; height: 54px;}
    .learning-system .system-area .ul-system .step02 .img_step {margin-left: 0; margin-right: 20px;}
    .learning-system .system-area .ul-system .step04 .img_step {margin-left: 0; margin-right: 20px;}
    
    .learning-system .system-area .ul-system .step04 .ul-img li {width: calc((100% - 120px)/2);}
    .learning-system .system-area .ul-system .step04 .ul-img li:nth-child(2) {margin-right: 60px;}

    .learning-system .system-area .ul-system .step02>.box .txt {text-align: left;}    
    .learning-system .system-area .ul-system .step04>.box .txt {text-align: left;}

    .learning-system .system-area .ul-system>.item .btn-experience {max-width: 350px; height: auto;}

    .speaking-swiper .ul-script {padding: 20px 40px;}

    .experience2 {margin-bottom: 90px;}
    .experience2 img {width: 300px;}

    .experience3 .writing .essay textarea {line-height: 50px; background-size: 100% 50px;}
    .ai_correction {min-height: 50px; line-height: 50px; background-size: 100% 50px;}
    .experience3 .writing .correct {margin-top: 60px;}
    .experience3 .writing .correct .btn_area .btn2 {height: auto;}    
    .feedback .btn-feedback {height: auto;}
    .count {font-size: 0.875em;}

    .videoStudy {padding: 180px 50px 90px;}
    .videoStudy .video_area .timeline_area {bottom: -27px;}
    .ul-bottom .item .btn2 {height: auto;}

    .curriculum {padding: 90px 50px 80px;}
    .curriculum .text1 {margin-bottom: 50px;}
    .curriculum-swiper {padding: 0 80px;}
    .course_area .lv {min-width: 126px; height: auto;}
    .course_area .text1 {margin-bottom: 0;}

    .review-swiper .item1 {padding: 24px 34px;}
    .review-swiper .item4 {padding: 54px 34px 34px;}
    .review-swiper .item3 {grid-template-rows: 14% 61.2% 24.8%;}

    .review-swiper .item1 .tit {margin-bottom: 18px; width: calc(100% - 100px);}
    .review-swiper .item1 .img_area {width: 70px; height: 70px; top: 24px; right: 34px;}
    .review-swiper .item1 .name {width: calc(100% - 70px);}
    .review-swiper .item1 .line {margin: 10px 0 24px;}
    .review-swiper .item1 .review-txt {height: 20.625em; -webkit-line-clamp: 11;}

    .review-swiper .item4 .tit {margin-bottom: 10px;}
    .review-swiper .item4 .img_area {margin-bottom: 34px;}
    .review-swiper .item4 .name {margin-bottom: 24px;}
    .review-swiper .item4 .review-txt {height: 15em; -webkit-line-clamp: 8;}
    
    .review-swiper .item3 .tit {margin: 24px 0 18px; padding: 0 34px;}
    .review-swiper .item3 .name {margin: 50px 0 24px; padding: 0 34px;}
    .review-swiper .item3 .review-txt {height: 20.625em; padding: 0 34px; -webkit-line-clamp: 11;}
    
    .review-swiper .item2 .tit {margin: 24px 0 18px; padding: 0 34px;}
    .review-swiper .item2 .name {padding: 0 34px 24px; margin-top: 34px;}
    .review-swiper .item2 .img_area {height: 120px;}
    .review-swiper .item2 .review-txt {height: 15em; padding: 0 34px; -webkit-line-clamp: 8;}

    .prize {padding: 80px 50px 70px;}
    .prize .btn_area .btn-info {max-width: 350px; height: auto;}

    .laurel {padding: 44px 50px;}

    #fp-nav {display: none;}
}

@media screen and (min-width:769px) {
    .learning-system .system-area .ul-system .step04>.box .txt br {display: none;}

    .experience1 .main {border-radius: 0 0 0 20px;}
    .experience1 .speaking-player {border-radius: 0 0 0 20px;}

    .ul-bottom .item {width: calc((100% - 60px)/4);}
    .ul-bottom .item:nth-child(4n) {margin-right: 0;}
    .ul-bottom .item:nth-last-child(-n+4) {margin-bottom: 0;}
}

@media screen and (max-width:768px){
    .title1 {line-height: 1.3;}

    .visual-swiper {height: 800px;}
    .visual1 .visual-bg img {display: none;}
    .ul-visual .item {padding: 0 50px; padding-top: 104px;}

    .ul-icon_area .item {padding: 12px 14px;}
    .ul-icon_area .item img {width: 50px; height: 50px;}

    .learning-system .system-area .ul-system>.item>.box {-webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .learning-system .system-area .ul-system .step01>.box .txt_area {width: 100%; margin-right: 0;}
    .learning-system .system-area .ul-system .step03>.box .txt_area {width: 100%; margin-bottom: 30px;}
    .learning-system .system-area .ul-system>.item>.box .txt {margin-bottom: 40px;}
    .learning-system .system-area .ul-system .step03>.box>img {position: static; transform: translateY(0); width: 100%;}
    .learning-system .system-area .ul-system .step04 .ul-img li {width: calc((100% - 60px)/2);}
    .learning-system .system-area .ul-system .step04 .ul-img li:nth-child(2) {margin-right: 30px;}

    .experience1 .speaking {flex-direction: column;}
    .experience1 .main {width: 100%; border-right: 0; border-bottom: var(--border-solid);}
    .experience1 .aside {width: 100%;}

    .experience3 .writing .topic .tit {padding: 15px 40px;}
    .experience3 .writing .topic .txt {padding: 15px 40px;}
    .experience3 .writing .essay_area {padding: 30px 40px;}
    .experience3 .writing .correct {margin-top: 50px;}
    .experience3 .writing .correct .ul-btn_area {-webkit-flex-wrap: wrap; flex-wrap: wrap;}

    .videoStudy {background-size: contain, 100% 94%}
    .videoStudy .top2 {height: auto;}
    .videoStudy .top2 .txt {display: inline-block;}
    .videoStudy .play_wrap {width: 100%;}
    .script_wrap {width: 100%; height: auto; padding: 30px 40px; border-left: 0; border-top: var(--border-solid);}

    .ul-curriculum {width: 100%;}
    .ul-curriculum .item1 {margin-left: 0;}

    .course_area {-webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;}
    .course_area .lv {margin-right: 30px;}
    .course_area .txt_area {width: 100%; order: 2; margin-right: 0;}
    .course_area .curriculum_txt {justify-content: center;}
    .course_area .img_area {order: 1; margin-bottom: 30px;}

    .review::before, .review::after {width: calc((((100% + 394px) - 80px)/3) - 197px); height: calc(100% - 154px);}
    .review-swiper .swiper-button-prev {left: calc(((100% - 80px)/3) + 10.625px);}
    .review-swiper .swiper-button-next {right: calc(((100% - 80px)/3) + 10.625px);}

    .laurel .txt_area {font-size: 2em;}
    .laurel .txt_wrap::before, .laurel .txt_wrap::after {width: 81px; height: 150px;}
}

@media screen and (min-width:481px) and (max-width:768px){
    .ul-bottom {padding: 12px 10px;}
    .ul-bottom .item {width: calc((100% - 36px)/4); margin-right: 12px; margin-bottom: 12px;}
    .ul-bottom .item:nth-child(4n) {margin-right: 0;}
    .ul-bottom .item:nth-last-child(-n+4) {margin-bottom: 0;}

    .ul-curriculum .item {width: calc((100% - 30px)/4); height: 90px; margin-right: 10px; margin-bottom: 10px;}
    .ul-curriculum .item:nth-child(4n) {margin-right: 0;}
    .ul-curriculum .item:nth-last-child(-n+4) {margin-bottom: 0;}
}

@media screen and (max-width:480px){
    .player .swiper-prev, .player .swiper-next {width: 26px; height: 26px;}
    .player .pagination {left: 10px;}
    .player .swiper-next {right: 10px;}
    .player .swiper-prev {right: 46px;}

    .visual-swiper {height: 734px;}
    .ul-visual .item {padding: 0 16px; padding-top: 104px;}
    .visual .title_area {margin-bottom: 50px;}
    .visual .title_area .txt {font-size: 1.4em; margin-bottom: 30px;}
    .visual .title_area .tit p:first-child {font-size: 1.6em;}
    .visual .title_area .tit .tint {font-size: 3.2em;}
    .btn-register {width: 66%; font-size: 1.5em;}
    .visual .borad .box {width: 100%;}
    .post-swiper {height: 48px;}
    .visual .borad .box .cate {padding: 12px 16px;}
    .visual .borad .box .post .item {padding: 14px 16px;}

    .tutor {padding: 60px 16px 80px;}
    .tutor .title1 {margin-bottom: 30px;}
    .ul-icon_area .item {width: 50%; border-bottom: var(--border-solid); padding: 10px 12px;}
    .ul-icon_area .item:nth-child(2n) {border-right: 0;}
    .ul-icon_area .item:nth-last-child(-n+2) {border-bottom: 0;}
    .multiple-swiper {width: 100%;}
    .video-swiper {margin-bottom: 80px;}

    .profile_area .profile-img {width: 120px; height: 120px; top: -60px;}
    .profile_area .profile-txt {width: 100%; padding: 100px 40px 50px;}
    
    .shadow-box {width: 300%; margin-top: 110px;}
    
    .tutor-swiper .swiper-button-prev {left: calc(100%/3 + 16px);}
    .tutor-swiper .swiper-button-next {right: calc(100%/3 + 16px);}
    
    .learning-system {padding: 80px 16px;}
    .learning-system .system-area .ul-system>.item {width: 100%;}
    .learning-system .system-area .ul-system .step05 {margin-bottom: 0;}
    .learning-system .system-area .ul-system>.item>.box .title1 {margin-right: auto; margin-bottom: 16px;}
    .learning-system .system-area .ul-system .step03>.box .title1 span {margin-bottom: -7px;}
    .learning-system .system-area .ul-system>.item .img_step {width: 66px; height: 44px; margin-right: 16px;}
    .learning-system .system-area .ul-system>.item>.box .txt {margin-bottom: 36px;}
    .learning-system .system-area .ul-system .step04 .ul-img {flex-direction: column;}
    .learning-system .system-area .ul-system .step04 .ul-img li {width: 100%; margin-bottom: 40px;}
    .learning-system .system-area .ul-system .step04 .ul-img li:nth-child(2) {width: calc(100% - 40px); margin-right: 40px;}

    .learning-system .system-area .ul-system>.item .btn-experience {width: 66%; font-size: 1.5em;}

    .speaking-swiper .ul-script {padding: 20px 16px;}
    .speaking-swiper .script {min-height: 122px;}

    .recorder .recorder_area .center {width: 100%; margin-bottom: 24px;}
    .recorder .recorder_area .right {width: 100%;}
    .recorder .native {padding: 20px 16px 0;}
    .recorder .student {padding: 0 16px;}

    .experience1 {margin-bottom: 60px;}
    .experience1>.text1 br {display: none;}

    .experience2 {margin-bottom: 60px;}
    .experience2 .inner {width: 100%; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .experience2 img {width: 100%; margin-bottom: 30px;}
    .experience2 .txt_area {width: 100%;}

    .experience3>.tit {height: 60px; line-height: 60px;}
    .experience3>.tit .beta {height: 36px;}
    .experience3 .writing .topic {-webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .experience3 .writing .topic .tit {width: 100%; padding: 6px 16px;}
    .experience3 .writing .topic .txt {width: 100%; border-left: 0; border-top: var(--border-solid); padding: 6px 16px;}
    .experience3 .writing .essay_area {padding: 30px 16px;}
    .experience3 .writing .essay .top {-webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .experience3 .writing .essay .top>.word {width: 100%; display: -webkit-flex; display: flex; flex-direction: column; margin-top: 20px;}
    .experience3 .writing .essay .btn_area {width: 100%;}
    .experience3 .writing .essay .btn_area .btn-correct {width: 66%;}
    .experience3 .writing .essay textarea {line-height: 44px; background-size: 100% 44px; padding: 0 16px;}
    .count {right: 16px;}
    .ai_correction {min-height: 44px; line-height: 44px; background-size: 100% 44px; padding: 0 16px; padding-bottom: 2px;}

    .experience3 .writing .correct {margin-top: 40px;}
    .experience3 .writing .correct .writing-player {width: 100%; height: 40px; padding: 0 16px; margin-right: 0;}
    .experience3 .writing .correct .writing-player .play_area {left: 50%; transform: translate(-50%, -50%);}
    .experience3 .writing .correct .ul-btn_area {width: 100%;}
    .experience3 .writing .correct .ul-btn_area .item {width: calc((100% - 12px)/2); margin-right: 12px; margin-bottom: 12px;}
    .experience3 .writing .correct .ul-btn_area .item:nth-child(2n) {margin-right: 0;}
    .experience3 .writing .correct .ul-btn_area .item:last-child {width: 100%; margin-right: 0; margin-bottom: 0;}
    .experience3 .writing .correct .btn_area {position: static; transform: translateY(0);}
    .experience3 .writing .correct .btn_area .btn2 {width: 100%;}
    .feedback .btn-feedback {position: static; transform: translateY(0); margin-top: 10px;}

    .videoStudy {padding: 100px 16px 60px;}
    .videoStudy .text1 {margin-bottom: 50px;}
    .videoStudy .top2 {padding: 10px 16px;}
    .videoStudy .top2 .ul-btn_area {flex-direction: column;}
    .videoStudy .top2 .ul-btn_area .item {margin-right: 0;}
    .script_wrap {padding: 20px 16px;}
    .ul-bottom {padding: 12px 10px;}
    .ul-bottom .item {width: calc((100% - 12px)/2); margin-right: 12px; margin-bottom: 12px;}
    .ul-bottom .item:nth-child(2n) {margin-right: 0;}
    .ul-bottom .item:nth-last-child(-n+2) {margin-bottom: 0;}
    .ul-bottom .item:last-child {margin-right: 0;}
    .ul-bottom .item .btn2 {height: auto;}

    .curriculum {padding: 60px 16px 50px;}
    .ul-curriculum .item {width: calc((100% - 6px)/3); height: 80px; border-radius: 10px; margin-right: 3px; margin-bottom: 3px;}
    .ul-curriculum .item:nth-child(3n) {margin-right: 0;}
    .ul-curriculum .item:nth-last-child(-n+3) {margin-bottom: 0;}
    .ul-curriculum .item .btn-curriculum {font-size: 1.2em; border-radius: 10px;}
    .curriculum-swiper {padding: 0 40px;}
    .course_area .lv {min-width: 84px; height: auto; padding: 8px 20px; line-height: 1.1; font-size: 1.125em; margin-right: 10px;}
    .course_area .course {font-size: 1.5em;}

    .curriculum-swiper .swiper-button-next:after, .curriculum-swiper .swiper-button-prev:after {font-size: 36px;}

    .review::before, .review::after {height: calc(100% - 148px);}
    .review-swiper .item1 {padding: 20px 16px;}
    .review-swiper .item3 {grid-template-rows: 12.2% 64.8% 23%;}

    .review-swiper .item1 .tit {margin-bottom: 14px;}
    .review-swiper .item1 .img_area {top: 14px; right: 16px;}
    .review-swiper .item1 .line {margin: 10px 0 16px;}
    .review-swiper .item1 .review-txt {height: 26.25em; -webkit-line-clamp: 14;}

    .review-swiper .item4 {padding: 36px 16px 20px;}
    .review-swiper .item4 .name {margin-bottom: 16px;}
    .review-swiper .item4 .review-txt {height: 22.5em; -webkit-line-clamp: 12;}

    .review-swiper .item3 .tit {margin: 20px 0 16px; padding: 0 16px;}
    .review-swiper .item3 .name {margin: 50px 0 20px; padding: 0 16px;}
    .review-swiper .item3 .review-txt {height: 24.375em; padding: 0 16px; -webkit-line-clamp: 13;}

    .review-swiper .item2 .tit {margin: 20px 0 16px; padding: 0 16px;}
    .review-swiper .item2 .name {padding: 0 16px 20px; margin-top: 50px;}
    .review-swiper .item2 .img_area {height: 100px;}
    .review-swiper .item2 .review-txt {height: 18.75em; padding: 0 16px; -webkit-line-clamp: 10;}

    .prize {padding: 80px 16px 70px;}
    .prize-swiper {padding: 0 68px;}
    .prize-swiper::before, .prize-swiper::after {width: 68px;}
    .prize-swiper .swiper-button-next:after, .prize-swiper .swiper-button-prev:after {font-size: 36px;}
    .prize .title1 span {display: block;}
    .prize .btn_area .btn-info {width: 66%; font-size: 1.5em;}

    .laurel {padding: 44px 16px;}
    .laurel .txt_area {font-size: 1.05em;}
    .laurel .txt_area .tint {font-size: 1.2em;}
    .laurel .txt_wrap::before, .laurel .txt_wrap::after {width: 60px; height: 111px;}
}