@charset "utf-8";
/* CSS Document */
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
/* 잘난체 */
@font-face{
    font-family:'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/* 티웨이 */
@font-face {
    font-family:'twaysky';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_tway@1.0/twaysky.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html,body{height:100%;}
*{margin:0; padding:0; box-sizing:border-box;}
li{list-style:none;}
a{text-decoration:none;}
img{image-rendering:-moz-crisp-edges; image-rendering:-o-crisp-edges; image-rendering:-webkit-optimize-contrast; image-rendering:crisp-edges; -ms-interpolation-mode:nearest-neighbor;}
input, textarea, select{outline:none; border:0; font-family:'SCoreDream';}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{color:transparent;}
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder{color:transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder{color:transparent;}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder{color:transparent;}
iframe{border:0;}
.ellipsis{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pt_100{padding-top:100px;}
body{font-family:'Noto Sans KR', sans-serif; line-height:1; color:#1b1d21; overflow-x:hidden;}

body::-webkit-scrollbar {
  width:4px;
}
body::-webkit-scrollbar-track {
  background-color: transparent;
}
body::-webkit-scrollbar-thumb {
  border-radius:3px; background-color:rgba(0,0,0,0.3);
}
body::-webkit-scrollbar-button {
  width:0; height:0;
}

/** 버튼 관련 **/
.flex_left{display:flex; flex-wrap:wrap;}

.btn_center{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; padding-top:25px;}
.btn_right{padding-top:20px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:end; -moz-box-pack:end; -webkit-justify-content:flex-end; justify-content:flex-end;}

.button_1{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#fff; background-color:#22bdff; width:84px; height:34px; border-radius:10px; font-size:15px; transition:0.2s; padding-bottom:1px; font-family:'SCoreDream';}
.button_1:hover{background-color:#5f41e1;}
.button_1.center{margin:0 auto;}

.button_1.big{width:180px; height:44px; font-size:18px;}

.button_2{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#666; background-color:#fff; border:1px solid #e4e4e4; width:84px; height:34px; border-radius:10px; font-size:15px; transition:0.2s; padding-bottom:1px; font-family:'SCoreDream';}
.button_2:hover{background-color:#5f41e1; border:1px solid #5f41e1; color:#fff;}
.button_2.center{margin:0 auto;}

.button_2.big{width:180px; height:44px; font-size:18px;}

.button_3{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#fff; background-color:#5f41e1; width:84px; height:34px; border-radius:10px; font-size:15px; transition:0.2s; padding-bottom:1px; font-family:'SCoreDream';}
.button_3:hover{background-color:#22bdff;}
.button_3.center{margin:0 auto;}

.button_3.big{width:180px; height:44px; font-size:18px;}

@media all and (min-width:1680px){
    .btn_center{padding-top:30px;}
    
    .button_1, .button_2, .button_3{width:88px; height:36px;}
}

/** 체크박스 **/
.check_input{display:none;}
.check_label{cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.check_label .check_bullet{width:20px; height:20px; margin-right:8px; background-color:#fff;}
.check_input:checked + .check_bullet{background-image:url(../images/check_1.png); background-size:100%;}

/** 라디오박스 **/
.radio_input{display:none;}
.radio_label{cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.radio_label .radio_bullet{width:20px; height:20px; border-radius:50%; background-color:#fff; margin-right:8px;}
.radio_input:checked + .radio_bullet{background-image:url(../images/radio_1.png); background-repeat:no-repeat; background-position:center; background-size:100%;}

/** 색상 **/
.bg_pink{background-color:#ff899d;}
.bg_sky{background-color:#8bdfee;}
.bg_violet{background-color:#a7a3f6;}
.bg_yellow{background-color:#ffcb00;}
.bg_blue{background-color:#4a86ff;}
.bg_gray{background-color:#ccc;}

/** 로그인 **/
.login_bg{background-image:url(../images/login_bg.jpg); background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;}

.login_wrap{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:100%; font-family:'SCoreDream';}
.login_area{width:800px; height:542px; border-radius:30px; background:url(../images/login_bg_inner.jpg) no-repeat center; background-size:cover; position:relative;}
.login_box{position:absolute; right:10px; top:10px; bottom:10px; width:51%; background-color:#fff; border-radius:20px; display:flex; align-items:center; justify-content:center; padding-top:1%;}
.login_inner{width:75%;}
.login_welcome{font-size:24px; font-weight:900; text-align:center;}
.login_guide{text-align:center; font-weight:300; margin-bottom:15px; font-size:14px;}

.login_logo{width:72%; max-width:275px; margin:15px auto; display:block;}

.login_input{width:100%; height:44px; border-bottom:1px solid #1b1d21; display:block; padding-left:1%; margin-bottom:15px; font-size:16px; font-weight:600; font-family:'SCoreDream';}
.login_input::placeholder{color:#1b1d21;}
.login_check{display:flex; justify-content:space-between; align-items:center; font-size:14px; margin-bottom:25px;}
.check_label.login .check_bullet{border:1px solid #1b1d21; border-radius:4px; width:18px; height:18px;}
.login_forgot{color:#1b1d21;}

.login_btn{display:block; width:100%; height:44px; line-height:44px; text-align:center; font-size:18px; background-color:#1b1d21; color:#fff; border-radius:30px; font-weight:600; transition:0.2s;}
.login_btn:hover{background-color:#5f41e1;}

.login_sign{text-align:center; font-size:15px; padding-top:30px;}
.login_sign small{font-size:14px;}
.login_sign_btn{color:#1b1d21; margin-left:8px; font-weight:600; transition:0.2s;}
.login_sign_btn:hover{color:#5f41e1;}

@media all and (min-width:1440px){
    .login_area{width:900px; height:610px;}
    .login_box{width:49%;}
    .login_welcome{font-size:28px;}

    .login_input{height:46px; font-size:17px;}
    .login_btn{height:46px; line-height:46px; font-size:19px;}

    .login_sign{padding-top:35px;}
    .login_sign_btn{margin-left:15px;}
}
@media all and (min-width:1680px){
    .login_area{width:1080px; height:732px; border-radius:50px;}
    .login_box{right:20px; top:20px; bottom:20px; width:48%; border-radius:30px;}
    .login_inner{width:72%;}
    .login_welcome{font-size:34px;}
    .login_logo{margin:20px auto;}
    .login_guide{font-size:16px; margin-bottom:30px;}
    
    .login_input{height:50px; font-size:19px; margin-bottom:20px;}
    .login_check{margin:20px 0 30px 0;}
    .login_btn{height:54px; line-height:54px; font-size:21px;}
    
    .login_sign{padding-top:50px; font-size:16px;}
    .login_sign_btn{margin-left:20px;}
    .login_sign small{font-size:15px;}
}

/* 레이아웃 좌측 */
.body_bg{background:url(../images/bg.jpg) no-repeat 50% 100% fixed; background-size:cover; padding:10px;}

.container_wrap{background-color:#fff; width:100%; height:100%; border-radius:40px; padding:20px 20px 20px 0; max-width:1840px; margin:0 auto; display:flex; justify-content:space-between;}
.left_wrap{width:250px; padding:0 30px; height:100%; position:relative;}
.logo{width:88%; max-width:207px; display:block; margin:0 auto;}
.profile{width:130px; height:130px; background-repeat:no-repeat; background-position:50%; background-size:cover; background-color:#77caf6; border-radius:45%; margin:25px auto 15px auto; position:relative;}
.camera{position:absolute; width:36px; height:36px; background:url(../images/camera.png) no-repeat 50%; background-color:#fff; border-radius:40%; border:1px solid #e1e1e1; bottom:-1%; right:-1%;}
.welcome{text-align:center; color:#777; font-size:14px; margin-top:30px;}
.welcome b{color:#222; font-weight:500; font-size:1.1em;}
.my_btns{display:flex; justify-content:space-between; padding-top:20px;}
.my_btn{width:92px; height:40px; display:flex; justify-content:center; align-items:center; border-radius:15px; transition:0.2s; font-size:14px; font-family:'SCoreDream'; padding-bottom:1px;}
.my_btn.my{color:#fff; background-color:#22bdff;}
.my_btn.my:hover{background-color:#5f41e1;}
.my_btn.logout{color:#999; border:1px solid #ddd;}
.my_btn.logout:hover{background-color:#5f41e1; border:1px solid #5f41e1; color:#fff;}

.nav_wrap{padding:20px 0 0 0;}
.nav{color:#1b1d21; display:flex; align-items:center; height:40px; transition:0.2s; font-family:'SCoreDream';}
.nav .icon{width:40px; height:40px; background-repeat:no-repeat; background-position:50%; margin-right:12px; transition:0.2s;}

.nav_1 .icon{background-image:url(../images/nav_1.png);}
.nav_2 .icon{background-image:url(../images/nav_2.png);}
.nav_3 .icon{background-image:url(../images/nav_3.png);}
.nav_4 .icon{background-image:url(../images/nav_4.png);}
.nav_5 .icon{background-image:url(../images/nav_5.png);}

.nav:hover .icon{background-color:#5f41e1; box-shadow:0 6px 6px 1px rgba(95,65,224,0.2); border-radius:30%;}
.nav_1:hover .icon{background-image:url(../images/nav_1_on.png);}
.nav_2:hover .icon{background-image:url(../images/nav_2_on.png);}
.nav_3:hover .icon{background-image:url(../images/nav_3_on.png);}
.nav_4:hover .icon{background-image:url(../images/nav_4_on.png);}
.nav_5:hover .icon{background-image:url(../images/nav_5_on.png);}

.nav.active{font-weight:600;}
.nav.active .icon{background-color:#5f41e1; box-shadow:0 6px 6px 1px rgba(95,65,224,0.2); border-radius:30%;}
.nav_1.active .icon{background-image:url(../images/nav_1_on.png);}
.nav_2.active .icon{background-image:url(../images/nav_2_on.png);}
.nav_3.active .icon{background-image:url(../images/nav_3_on.png);}
.nav_4.active .icon{background-image:url(../images/nav_4_on.png);}
.nav_5.active .icon{background-image:url(../images/nav_5_on.png);}

footer{font-size:12px; position:absolute; bottom:0; left:30px; color:#888; line-height:1.4; font-weight:300;}
.footer_copy{padding-top:5px;}

.nav_flow{display:flex; justify-content:center; align-items:center; position:relative; height:44px; background-color:#5f41e1; color:#fff; transition:0.2s; border-radius:15px; font-size:18px; font-weight:500; margin:0 auto 15px auto; width:80%;}
.nav_flow:hover{background-color:#22bdff;}
.nav_flow_c{width:56px; position:absolute; left:-28px; top:-7px;}

.policy_wrap{display:flex; justify-content:space-between; padding-top:10px; width:100%;}
.policy_btn{padding:5px 10px; border:1px solid #ddd; color:#333; margin-right:10px; border-radius:4px;}

/* 레이아웃 우측 */
.wrap{height:100%; width:calc(100% - 250px); display:flex; flex-wrap:wrap;}

.title_wrap{display:flex; justify-content:space-between; align-items:center; width:100%; height:32px; padding:0 2px; margin-bottom:15px; position:relative;}
.title{display:flex; align-items:center; font-size:21px; font-family:'SCoreDream'; font-weight:600;}
.title_text{font-weight:400; font-size:13px; padding:3px 0 0 8px;}
.title_icon{margin-right:10px; width:32px;}
.title_right{color:#666; font-size:13px; display:flex; justify-content:space-between; align-items:center;}
.title_right_icon{margin-right:6px;}
.title_review{color:#5f41e1; position:absolute; left:40px; top:-12px; font-weight:400; font-size:13px; font-weight:500;}

.area{background-color:#f3f6ff; border-radius:30px; width:100%; height:calc(100% - 50px); padding:30px; overflow:auto;}
.area::-webkit-scrollbar{width:4px;}
.area::-webkit-scrollbar-track{background-color:transparent;}
.area::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0.4);}
.area::-webkit-scrollbar-button{width:0; height:0;}

.area.member{background:none; padding:0; border-radius:0;}

.area.bbs{padding:40px 60px;}

.area_2{width:100%; height:calc(100% - 50px); display:flex; justify-content:space-between;}

@media all and (min-width:1024px){
    .area.member{background-color:#f3f6ff; padding:30px; border-radius:30px;}
}
@media all and (min-width:1440px){
    .body_bg{padding:20px;}
    
    .title{font-size:23px;}
    .title_text{font-size:15px;}
    .title_right{color:#666; font-size:14px;}
    
    .profile{width:134px; height:134px;}
    .welcome{margin-top:35px;}
    .nav_wrap{padding:25px 0 0 0;}
    .nav{height:44px;}
}
@media all and (min-width:1680px){
    .body_bg{padding:30px;}
    
    .container{border-radius:45px; padding:40px 40px 40px 0;}
    .left_wrap{width:310px; padding:0 45px;}
    .logo{width:207px;}
    .profile{width:150px; height:150px; margin:35px auto 20px auto;}
    .welcome{margin-top:40px;}
    .camera{width:38px; height:38px;}
    
    .my_btns{padding-top:25px;}
    .my_btn{width:102px; height:44px; display:flex; justify-content:center; align-items:center; border-radius:15px; transition:0.2s; font-size:15px; font-family:'SCoreDream'; padding-bottom:1px;}
    
    .nav_wrap{padding:40px 0 0 0;}
    .nav{height:50px; font-size:17px;}
    
    footer{font-size:14px; left:45px; line-height:1.5;}
    .nav_flow{margin-bottom:25px;}
    
    .policy_btn{padding:5px 12px;}
    
    .title_wrap{height:36px; margin-bottom:18px;}
    .title{font-size:24px;}
    .title_text{font-size:16px; padding:3px 0 0 10px;}
    .title_icon{margin-right:12px; width:36px;}
    .title_right{font-size:15px;}

    .area, .area_2, .area.member{border-radius:40px; height:calc(100% - 54px); padding:40px;}
    .area_2{padding:0;}
    .area.bbs{padding:45px 100px;}
    
    .title_review{top:14px; right:290px; left:auto; font-size:14px;}
}
@media all and (min-width:1920px){
    .body_bg{padding:40px;}    
}

/* 마이 레슨 */
.lesson_wrap{background-color:#f3f6ff; border-radius:30px; width:calc(100% - 224px); height:100%; padding:30px 30px; overflow:auto; display:flex; justify-content:center;}
.lesson_wrap::-webkit-scrollbar{width:4px;}
.lesson_wrap::-webkit-scrollbar-track{background-color:transparent;}
.lesson_wrap::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0.4);}
.lesson_wrap::-webkit-scrollbar-button{width:0; height:0;}
.lesson_area{display:flex; justify-content:space-between; width:100%;}

.lesson_list{width:23%; font-family:'SCoreDream';}

.lesson_list .caption, .lesson_list .list{height:82px; text-align:center; display:flex; justify-content:center; align-items:center; border-radius:20px;}
.lesson_list .arrow{padding:8px 0;}
.lesson_list .arrow img{display:block; margin:0 auto;}

.lesson_list .caption{background-color:#5f41e1; color:#fff;}
.lesson_list .caption h3{font-weight:600; padding-bottom:6px;}
.lesson_list .caption small{font-weight:300;}
.lesson_list_date{color:#fae300; padding-top:8px; font-weight:300; font-size:12px;}

.lesson_list .list{background-color:#fff;}
.lesson_list .list h4{font-weight:600; padding-bottom:10px;}

.lesson_btn{display:flex; justify-content:center; align-items:center; width:106px; height:30px; border:1px solid #e3e3e3; color:#555; font-size:14px; border-radius:10px; font-family:'Noto Sans KR', sans-serif; padding-bottom:1px; transition:0.2s; margin:0 auto;}
.lesson_btn:hover{background-color:#5f41e1; border:1px solid #5f41e1; color:#fff;}

.lesson_list .complete{background-color:#0562ff; color:#fff;}
.lesson_list .complete .lesson_btn{background-color:#22bdff; border:1px solid #22bdff; color:#fff; cursor:default;}

.lesson_list .errordate{background-color:#b4c6ff; color:#fff;}
.lesson_list .errordate .lesson_btn{border:1px solid #fff; color:#fff; cursor:default;}
.lesson_list .errordate .lesson_btn:hover{border:1px solid #fff; color:#fff; background:none;}

.lesson_list .before{background-color:#22bdff; color:#fff;}
.lesson_list .before .lesson_btn{border:1px solid #fff; color:#fff; cursor:default;}

.lesson_list .current{border:3px solid rgba(95,65,225,0.8);}

.lesson_right{display:flex; flex-direction:column; justify-content:space-between; width:200px; height:100%;}

.lesson_zoom{border-radius:30px; background-color:#22bdff; height:38%; display:flex; justify-content:center; align-items:center; text-align:center; color:#fff;}
.lesson_zoom_icon{display:block; margin:0 auto;}
.lesson_zoom_caption{font-size:20px; line-height:1.25; font-family:'SCoreDream'; font-weight:500; padding-top:10px;}

.lesson_date{border-radius:30px; border:1px solid #e3e3e3; height:58%; display:flex; justify-content:center; align-items:center; text-align:center;}
.lesson_date_icon{display:block; margin:0 auto;}
.lesson_date_caption{font-size:21px; font-weight:500; padding-top:10px;}
.lesson_time{font-size:17px; line-height:1.4; padding:20px 0; font-family:'SCoreDream';}
.lesson_state{margin-bottom:20px; line-height:1.5;}
.lesson_state_small{font-size:14px; color:#666;}

.lesson_zoom_btn_2{display:flex; justify-content:center; align-items:center; background-color:#22bdff; color:#fff; width:108px; height:44px; border-radius:15px; font-size:16px; font-weight:500; padding-bottom:2px; margin:0 auto; transition:0.2s;}
.lesson_zoom_btn_2:hover{background-color:#5f41e1;}

.lesson_zoom_btn_2.off{background-color:#ddd; color:#fff; cursor:default;}

.lesson_zoom_btn_3{display:flex; justify-content:center; align-items:center; background-color:#5f41e1; color:#fff; width:108px; height:44px; border-radius:15px; font-size:16px; font-weight:500; padding-bottom:2px; margin:0 auto; transition:0.2s; margin-top:10px;}
.lesson_zoom_btn_3:hover{background-color:#22bdff;}

.lesson_zoom_btn_3.off{background-color:#ddd; color:#fff; cursor:default;}

@media all and (min-height:700px){
    .lesson_wrap{align-items:center; padding:0 30px;}
}
@media all and (min-width:1440px){
    .lesson_wrap{width:calc(100% - 248px);}
    .lesson_right{width:220px;}
    
    .lesson_list .caption, .lesson_list .list{height:92px;}
    .lesson_list .arrow{padding:10px 0;}
    .lesson_list_date{font-size:13px;}
}
@media all and (min-width:1680px){
    .lesson_wrap{width:calc(100% - 274px); padding:0 50px; border-radius:40px;}
    .lesson_right{width:242px;}
    
    .lesson_zoom, .lesson_date{border-radius:40px;}
    .lesson_zoom{height:40%;}
    .lesson_date{height:56%;}
    
    .lesson_list{width:22%;}
    .lesson_list .caption, .lesson_list .list{height:104px; border-radius:30px;}
    .lesson_list .arrow{padding:10px 0;}
    
    .lesson_list .caption h3{padding-bottom:10px; font-size:22px;}
    .lesson_list .caption small{font-size:15px;}
    .lesson_list_date{font-size:14px; padding-top:10px;}
    
    .lesson_list .list h4{padding-bottom:13px; font-size:20px;}
    
    .lesson_btn{width:116px; height:36px; font-size:15px;}
    
    .lesson_time{font-size:17px; line-height:1.4; padding:25px 0 20px 0;}
    .lesson_state{margin-bottom:25px; line-height:1.6; font-size:18px;}
    .lesson_state_small{font-size:16px; color:#666;}
    .lesson_zoom_btn_3{margin-top:15px;}
}

/* 학습화면 인트로 */
.study_wrap.level_1, .study_wrap.level_2, .study_wrap.level_3{padding:35px;}
.study_wrap.level_1 .study_box{background-color:#fdf2e8;}
.study_wrap.level_2 .study_box{background-color:#e6f6d9;}
.study_wrap.level_3 .study_box{background-color:#f3f6ff;}

.study_wrap.level_1 .study_intro_month span{color:#ee7337;}
.study_wrap.level_2 .study_intro_month span{color:#4d8d2e;}
.study_wrap.level_3 .study_intro_month span{color:#5f41e1;}

.study_intro_btn.level_0{background-color:#24b8fe; color:#fff; }
.study_intro_btn.level_0:hover{background-color:#4c67ea;}
.study_wrap.level_1 .study_intro_btn{background-color:#ee7337; color:#fdf2e8;}
.study_wrap.level_1 .study_intro_btn:hover{background-color:#189ca3; color:#fff;}
.study_wrap.level_2 .study_intro_btn{background-color:#4d8d2e; color:#e6f6d9;}
.study_wrap.level_2 .study_intro_btn:hover{background-color:#189ca3; color:#fff;}
.study_wrap.level_3 .study_intro_btn{background-color:#5f41e1; color:#f3f6ff;}
.study_wrap.level_3 .study_intro_btn:hover{background-color:#ee7337; color:#fff;}

.study_wrap.level_1 .study_intro_grade{background-color:#ee7337; color:#fdf2e8;}
.study_wrap.level_2 .study_intro_grade{background-color:#4d8d2e; color:#e6f6d9;}
.study_wrap.level_3 .study_intro_grade{background-color:#5f41e1; color:#f3f6ff;}

.study_wrap.level_1 .study_intro_subject_wrap{border-color:#ee7337;}
.study_wrap.level_2 .study_intro_subject_wrap{border-color:#4d8d2e;}
.study_wrap.level_3 .study_intro_subject_wrap{border-color:#5f41e1;}

.study_intro_wrap{height:100%; display:flex; justify-content:center; align-items:center;}
.study_intro_logo{position:absolute; width:110px; left:4.5%; top:8%;}
.study_intro_level{padding:60px 0; text-align:center; line-height:1.8; margin-top:-25px; position:relative;}
.study_ib{position:absolute; width:100%; left:0; top:-10px; font-size:42px;}
.study_intro_month{font-size:48px; font-weight:700;}
.study_intro_week{font-weight:300; font-size:36px;}

.study_intro_bottom{position:absolute; left:0; bottom:12%; width:100%;}
.study_intro_btn{margin:0 auto; width:200px; height:58px; border-radius:20px; display:flex; justify-content:center; align-items:center; position:relative; font-family:'yg-jalnan'; font-size:25px; padding-left:20px; letter-spacing:0.5px; transition:0.2s;}
.study_intro_btn_c{position:absolute; left:-65px; top:-30px; width:106px;}

.study_intro_subject_wrap{position:absolute; right:4.5%; top:0; display:flex; justify-content:center; align-items:center; width:280px; height:98px; border-width:3px; border-style:solid; border-radius:20px;}
.study_intro_subject_area{text-align:center; font-size:22px; font-weight:600;}
.study_intro_subject_icon{width:64px; margin-right:12px;}
.study_intro_grade{border-radius:30px; width:94px; height:28px; font-weight:400; display:flex; justify-content:center; align-items:center; font-size:16px; margin:8px auto 0 auto;}

@media all and (min-width:1440px){
    .study_ib{top:-25px; font-size:48px;}
    .study_intro_month{font-size:52px;}
    .study_intro_week{font-size:39px;}
}
@media all and (min-width:1680px){    
    .study_wrap.level_1, .study_wrap.level_2, .study_wrap.level_3{padding:55px;}
    
    .study_intro_logo{width:140px;}
    .study_intro_level{line-height:1.9; margin-top:-50px;}
    .study_ib{top:-36px; font-size:54px;}
    .study_intro_month{font-size:62px;}
    .study_intro_week{font-size:45px;}
    
    .study_intro_btn{width:260px; height:74px; border-radius:24px; font-size:32px; padding-left:20px;}
    .study_intro_btn_c{position:absolute; left:-80px; top:-35px; width:130px;}
    
    .study_intro_subject_wrap{width:330px; height:116px; border-width:4px; border-radius:24px;}
    .study_intro_subject_area{font-size:25px;}
    .study_intro_subject_icon{width:72px; margin-right:15px;}
    .study_intro_grade{width:106px; height:32px; font-size:18px; margin:10px auto 0 auto;}
}    

/* 학습화면 레이아웃 */
.study_wrap{padding:30px 30px 0 30px; display:flex; flex-direction:column; height:100%;}

.study_top{position:relative; height:46px; display:flex; justify-content:center; align-items:center; margin-bottom:20px;}
.study_title{text-align:center; font-size:32px;}
.study_title_week{font-weight:400; color:#5f41e1;}

.study_top_logo{position:absolute; height:50px; top:-2px; left:5px;}

.study_nav, .study_tip, .study_tip_2{display:flex; align-items:center; font-family:'SCoreDream'; font-size:17px; position:absolute; top:calc(50% - 23px); cursor:pointer;}
.study_nav{left:10px;}
.study_tip{right:0; top:calc(50% - 21px);}
.study_tip_2{right:68px; top:calc(50% - 23px);}
.study_nav_icon{margin-right:14px;}
.study_tip_icon{margin-left:14px;}

.study_tip.close{right:0; top:calc(50% - 24px);}
.study_tip.close .study_tip_icon{margin:0;}
.study_tip.close .study_tip_icon{transition:0.3s;}
.study_tip.close:hover .study_tip_icon{transform:rotate(180deg);}

.reference_nav_wrap{background-color:rgba(34,189,255,0.9); padding:10px 0; border-radius:30px; width:200px; position:absolute; left:0; top:66px; display:none; z-index:1000;}

.reference_nav{display:block; width:70px; margin:23px auto; text-align:center; font-family:'SCoreDream'; color:#1b1d21; font-size:17px; font-weight:500;}
.reference_nav_icon{display:block; height:70px; background-repeat:no-repeat; background-position:50%; background-color:#fff; border-radius:40%; box-shadow:0 6px 6px 1px rgba(95,65,224,0.2); margin-bottom:11px; transition:0.2s;}

.reference_nav.nav_1 .reference_nav_icon{background-image:url(../images/nav_study_1.png);}
.reference_nav.nav_2 .reference_nav_icon{background-image:url(../images/nav_study_2.png);}
.reference_nav.nav_3 .reference_nav_icon{background-image:url(../images/nav_study_3.png);}
.reference_nav.nav_4 .reference_nav_icon{background-image:url(../images/nav_study_4.png);}

.reference_nav:hover .reference_nav_icon{background-color:#5f41e1;}
.reference_nav.nav_1:hover .reference_nav_icon{background-image:url(../images/nav_study_1_on.png);}
.reference_nav.nav_2:hover .reference_nav_icon{background-image:url(../images/nav_study_2_on.png);}
.reference_nav.nav_3:hover .reference_nav_icon{background-image:url(../images/nav_study_3_on.png);}
.reference_nav.nav_4:hover .reference_nav_icon{background-image:url(../images/nav_study_4_on.png);}

.reference_nav.active .reference_nav_icon{background-color:#5f41e1;}
.reference_nav.nav_1.active .reference_nav_icon{background-image:url(../images/nav_study_1_on.png);}
.reference_nav.nav_2.active .reference_nav_icon{background-image:url(../images/nav_study_2_on.png);}
.reference_nav.nav_3.active .reference_nav_icon{background-image:url(../images/nav_study_3_on.png);}
.reference_nav.nav_4.active .reference_nav_icon{background-image:url(../images/nav_study_4_on.png);}

.tip_wrap{background-color:rgba(95,65,224,0.9); padding:20px 30px 20px 30px; border-radius:30px; width:1000px; position:absolute; right:0; top:66px; display:none; z-index:1000;}
.tip_close{position:absolute; width:16px; right:20px; top:20px; cursor:pointer;}
.tip_title{font-family:'SCoreDream'; font-weight:500; color:#fff; display:flex; align-items:center; padding-bottom:20px; border-bottom:1px solid #fff; margin-bottom:5px; font-size:19px;}
.tip_title_icon{margin-right:8px;}
.tip_text{color:#fff; font-family:'SCoreDream'; display:flex; flex-wrap:wrap;}
.tip_word{font-size:14px; margin:4px 15px; }

.tip_wrap_5{background-color:rgba(95,65,224,0.9); padding:20px 30px 20px 30px; border-radius:30px; width:1000px; position:absolute; right:0; top:66px; display:none; z-index:1000;}
.tip_title_wrap_5{display:flex; justify-content:space-between; align-items:center; padding-bottom:20px; border-bottom:1px solid #fff; margin-bottom:5px;}
.tip_close_5{width:16px; cursor:pointer; transition:0.3s;}
.tip_close_5:hover{transform:rotate(180deg);}
.tip_title_5{font-family:'SCoreDream'; font-weight:500; color:#fff; display:flex; align-items:center; font-size:19px;}
.tip_title_icon_5{margin-right:8px;}
.tip_text_5{color:#fff; font-family:'SCoreDream'; display:flex; flex-wrap:wrap;}
.tip_word_5{font-size:14px; margin:4px 15px;}

.submit{display:flex; justify-content:center; align-items:center; width:186px; height:48px; background-color:#5f41e1; color:#fff; font-size:20px; font-weight:500; font-family:'SCoreDream'; border-radius:14px; margin:0 auto; transition:0.2s;}
.submit:hover{background-color:#22bdff;}
.submit .icon{margin-right:12px;}

.pop_close{display:flex; justify-content:center; align-items:center; width:186px; height:48px; background-color:#22bdff; color:#fff; font-size:20px; font-weight:500; font-family:'SCoreDream'; border-radius:14px; margin:0 auto; transition:0.2s; position:relative; z-index:10;}
.pop_close:hover{background-color:#5f41e1;}
.pop_close .icon{margin-right:8px;}

.study_bottom{position:relative; height:70px; margin:15px 0 0 0; padding-top:14px; display:flex; align-items:center; font-family:'yg-jalnan';}

.prev_wrap{position:absolute; top:0; left:86px; z-index:100;}
.prev_c{position:relative; z-index:20; width:80px;}
.prev_balloon_wrap{position:absolute; top:-5px; left:-72px; background-image:url(../images/btn_ballon_1.png); background-repeat:no-repeat; background-size:cover; width:80px; height:64px; z-index:10; transition:0.2s;}
.prev_balloon_area{position:absolute; right:5.5%; left:0; top:3%; bottom:6%; display:flex; justify-content:center; align-items:center; transition:0.2s; font-size:18px; color:#fff;}
.prev_arrow{margin-right:4px; width:14px;}
.prev_wrap:hover .prev_balloon_wrap{background-image:url(../images/btn_ballon_1_on.png);}
.prev_wrap.none .prev_balloon_wrap{background-image:url(../images/btn_ballon_1_none.png);}

.submit_btn{margin:0 auto; width:170px; height:44px; border-radius:20px; background-color:#5f41e1; display:flex; justify-content:center; align-items:center; transition:0.2s; font-size:20px; color:#fff; position:relative; padding-left:32px}
.submit_c{position:absolute; left:-35px; top:-24px; width:80px;}
.submit_btn:hover{background-color:#24b8fe;}
.submit_btn.none{background-color:#bbb;}

.next_wrap{position:absolute; top:0; right:86px; z-index:100;}
.next_c{position:relative; z-index:20; width:80px;}
.next_balloon_wrap{position:absolute; top:-5px; right:-72px; background-image:url(../images/btn_ballon_2.png); background-repeat:no-repeat; background-size:cover; width:80px; height:64px; z-index:10;  transition:0.2s;}
.next_balloon_area{position:absolute; left:5.5%; right:0; top:3%; bottom:6%; display:flex; justify-content:center; align-items:center; transition:0.2s; font-size:18px; color:#fff;}
.next_balloon_area.last{font-size:15px;}
.next_arrow{margin-left:4px; width:14px;}
.next_wrap:hover .next_balloon_wrap{background-image:url(../images/btn_ballon_2_on.png);}
.next_wrap.none .next_balloon_wrap{background-image:url(../images/btn_ballon_2_none.png);}

.submit_preview{background-color:#666; color:#fff; width:180px; height:44px; border-radius:20px; display:flex; justify-content:center; align-items:center; transition:0.2s; position:absolute; right:190px; font-size:18px;}
.submit_preview:hover{background-color:#333;}

.start_btn{display:flex; justify-content:center; align-items:center; width:220px; height:60px; background-color:#5f41e1; color:#fff; font-size:24px; font-weight:500; font-family:'SCoreDream'; border-radius:14px; margin:0 auto; transition:0.2s;}
.start_btn:hover{background-color:#22bdff;}
.start_btn .icon{margin-right:14px;}

.study_close{position:absolute; right:0; top:0; display:flex; justify-content:center; align-items:center; background-color:#22bdff; color:#fff; width:150px; height:48px; font-size:20px; font-weight:500; font-family:'SCoreDream'; border-radius:14px; transition:0.2s;}
.study_close:hover{background-color:#5f41e1;}
.study_close_icon{width:18px; margin-right:8px;}

.study_area{height:calc(100% - 171px); background-color:#f3f6ff; border-radius:30px; position:relative;}

.study_box{width:100%; height:100%; overflow:auto; padding:2.5% 3% 0 3%; font-family:'SCoreDream'; position:relative; z-index:10; background-color:#f3f6ff; border-radius:30px;}
.study_box::-webkit-scrollbar{width:4px;}
.study_box::-webkit-scrollbar-track{background-color:transparent;}
.study_box::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0);}
.study_box::-webkit-scrollbar-button{width:0; height:0;}

.study_inner{padding:20px 0 0 0; overflow-y:auto; height:calc(100% - 50px);}
.study_inner.v_center{padding:0; display:flex; align-items:center; height:calc(100% - 60px);}
.study_width{position:relative;}
.study_inner.pl{margin-left:52px;}

.study_inner::-webkit-scrollbar{width:0;}
.study_inner::-webkit-scrollbar-track{background-color:transparent;}
.study_inner::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0.4);}
.study_inner::-webkit-scrollbar-button{width:0; height:0;}

.study_passage{display:flex; justify-content:space-between; align-items:center; position:relative;}
.study_passage_left{display:flex; align-items:center; font-size:18px; line-height:1.35; width:100%;}
.study_passage_icon{margin-left:12px;}

.study_num{background-color:#5f41e1; color:#fff; width:42px; height:42px; border-radius:40%; display:flex; justify-content:center; align-items:center; font-size:20px; font-weight:600; margin-right:15px;}
.study_subject{width:calc(100% - 50px);}
.study_subject.width_1{width:calc(100% - 50px);}
.study_subject.width_2{width:calc(100% - 100px);}

.study_passage_right{display:flex;}
.study_passage_ing{width:43px; height:42px; background-repeat:no-repeat; background-position:50%; background-size:cover; margin-left:10px;}
.study_passage_play, .study_passage_pause{width:43px; height:42px; background-repeat:no-repeat; background-position:50%; background-size:cover; margin-left:10px; transition:0.2s;}
.study_passage_ing{background-image:url(../images/play_ing.webp);}
.study_passage_play{background-image:url(../images/play.png);}
.study_passage_pause{background-image:url(../images/pause.png);}
.study_passage_play:hover{background-image:url(../images/play_on.png);}
.study_passage_pause:hover{background-image:url(../images/pause_on.png);}
.study_passage_play.on{background-image:url(../images/play_on.png);}
.study_passage_pause.on{background-image:url(../images/pause_on.png);}

.sound_play_wrap{display:flex; position:absolute; right:0; top:0;}
.study_text_wrap{position:relative;}

@media all and (min-width:1440px){
    .study_wrap{padding:35px 35px 0 35px;}
    
    .study_bottom{height:75px; margin:15px 0 0 0; padding-top:14px;}

    .prev_wrap{left:86px;}
    .prev_c{width:86px;}
    .prev_balloon_wrap{top:-5px; left:-80px; width:86px; height:69px;}
    .prev_balloon_area{font-size:19px;}
    .prev_arrow{margin-right:4px; width:15px;}

    .submit_btn{width:180px; height:46px; padding-left:32px}
    .submit_c{left:-35px; top:-26px; width:86px;}

    .next_wrap{right:86px;}
    .next_c{width:86px;}
    .next_balloon_wrap{top:-5px; right:-80px; width:86px; height:69px;}
    .next_balloon_area{font-size:19px;}
    .next_balloon_area.last{font-size:16px;}
    .next_arrow{margin-left:4px; width:15px;}
    
    .submit_preview{width:180px; height:46px; font-size:19px; right:200px;}
    
    .study_area{height:calc(100% - 176px);}
    
    .study_inner{height:calc(100% - 50px);}
    
    .tip_wrap{padding:20px 15px 20px 15px; width:270px; top:67px;}
    .tip_title_wrap{padding-bottom:15px;}
    .tip_word{font-size:15px; margin:5px 13px; line-height:1.3;}
    
    .tip_wrap_5{padding:20px 15px 20px 15px; width:270px; top:67px;}
    .tip_title_wrap_5{padding-bottom:15px;}
    .tip_word_5{font-size:15px; margin:5px 13px; line-height:1.3;}
}
@media all and (min-width:1680px){
    .study_wrap{padding:35px 40px 0 40px;}
    
    .study_top{margin-bottom:30px;}
    .study_title{font-size:34px;}
    
    .study_area{height:calc(100% - 196px); border-radius:40px;}    
    .study_box{border-radius:40px; padding:3% 4% 0 4%;} 
    .study_inner{padding:25px 0 0 0; height:calc(100% - 54px);}
    
    .study_inner.pl{margin-left:62px;}
    
    .study_num{width:46px; height:46px; font-size:22px; margin-right:18px;}
    
    .reference_nav_wrap{padding:15px 0; border-radius:40px; top:76px;}
    .reference_nav{width:76px; margin:30px auto; font-size:18px;}
    .reference_nav_icon{height:76px; margin-bottom:12px;}
        
    .study_passage_left{font-size:19px;}

    
    .study_bottom{height:75px; margin:15px 0 0 0; padding-top:18px;}

    .prev_wrap{left:86px;}
    .prev_c{width:90px;}
    .prev_balloon_wrap{top:-5px; left:-80px; width:90px; height:72px;}
    .prev_balloon_area{font-size:20px;}
    .prev_arrow{margin-right:4px; width:16px;}

    .submit_btn{width:190px; height:48px; padding-left:35px}
    .submit_c{left:-35px; top:-26px; width:90px;}

    .next_wrap{right:86px;}
    .next_c{width:90px;}
    .next_balloon_wrap{top:-5px; right:-80px; width:90px; height:72px;}
    .next_balloon_area{font-size:20px;}
    .next_balloon_area.last{font-size:18px;}
    .next_arrow{margin-left:4px; width:16px;}
    
    .submit_preview{width:190px; height:48px; font-size:19px; right:210px;}    
    
    .tip_wrap{padding:25px 20px 20px 20px; width:298px; top:76px;}
    .tip_title_wrap{padding-bottom:20px;}
    .tip_word{font-size:15px; margin:6px 14px;}
    
    .tip_wrap_5{padding:25px 20px 20px 20px; width:298px; top:76px;}  
    .tip_title_wrap_5{padding-bottom:20px;}
    .tip_word_5{font-size:15px; margin:6px 14px;}
}

/* 유형 1 */
.table_1 li{display:flex; justify-content:space-between; margin:10px 0;}

/* goonglee
.table_1_caption{width:230px; display:flex; align-items:center; text-align:left; color:#fff; position:relative; padding-left:3%; min-height:52px; border-radius:10px; font-size:19px; font-weight:500;}
*/
.table_1_caption{width:calc(100% - 1030px); display:flex; align-items:center; text-align:left; color:#fff; position:relative; padding-left:1%; min-height:52px; border-radius:10px; font-size:16px; font-weight:500;}

.table_1_point{position:absolute; right:-14px; top:calc(50% - 10.5px); display:none;}

.table_1_caption.title{background-color:#24b8fe;}
.table_1_caption.date{background-color:#24b8fe;}
.table_1_caption.writer{background-color:#2da7fa;}
.table_1_caption.greeting{background-color:#2da7fa;}
.table_1_caption.introduction{background-color:#3892f5;}
.table_1_caption.body{background-color:#4c67ea;}
.table_1_caption.conclusion{background-color:#5c47e2;}
.table_1_caption.closing{background-color:#4832d3;}

/* goonglee
.table_1_content{line-height:1.8; font-size:19px; width:calc(100% - 300px); display:flex; align-items:center; flex-wrap:wrap; word-break:keep-all;}
*/
.table_1_content{line-height:1.8; font-size:19px; display:flex; align-items:center; flex-wrap:wrap; word-break:keep-all; width:1000px;}
.table_1_content p{width:100%;}
.table_1_content.title{font-size:32px; font-weight:600; text-indent:0; line-height:1;}
.table_1_content.writer{text-align:right; justify-content:flex-end;}

.table_3{font-size:19px;}
.table_3_content{margin:10px 0; display:flex; align-items:center;}
.table_3_content.writer{justify-content:flex-end;}

.input_1{display:block; width:100%; height:48px; text-align:center; font-size:18px;}
.input_1::placeholder{color:#ccc; font-weight:300;}

@media all and (min-width:1680px){
    .table_2{border-spacing:10px;}
    .table_2 th, .table_2 td{border-radius:10px;}
    .table_2 th{height:54px; font-size:19px;}
    .table_2 td{height:56px;}
    .input_1{height:50px; font-size:19px;}
}

.input_2, .textarea_1{display:block; width:100%; height:52px; background:none; font-size:19px; font-weight:500;}
.input_2.title{border-bottom:2px solid #24b8fe; font-weight:700; font-size:32px;}
.input_2.date{border-bottom:2px solid #24b8fe;}
.input_2.writer, .input_2.greeting{border-bottom:2px solid #2da7fa;}

.textarea_1{background-repeat:repeat;}
.textarea_1.introduction{background-image:url(../images/line_3.png); height:52px; line-height:52px;}
.textarea_1.body{background-image:url(../images/line_4.png); height:156px; line-height:52px;}
.textarea_1.conclusion{background-image:url(../images/line_5.png); height:52px; line-height:52px;}
.textarea_1.closing{background-image:url(../images/line_6.png); height:52px; line-height:52px;}

.textarea_1::-webkit-scrollbar{width:4px;}
.textarea_1::-webkit-scrollbar-track{background-color:transparent;}
.textarea_1::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0.4);}
.textarea_1::-webkit-scrollbar-button{width:0; height:0;}

/* goonglee
@media all and (min-width:1680px){
    .table_1_caption{width:260px; font-size:20px;}
    .table_1_content{font-size:20px; width:calc(100% - 330px);}
    .table_1_content.title{font-size:35px;}
}
*/
@media all and (min-width:1440px){
    .table_1_caption{padding-left:3%; font-size:19px;}
}
@media all and (min-width:1680px){
    .table_1{width:1280px; margin:0 auto;}
    
    .table_1_caption{font-size:20px;}
    .table_1_content{font-size:20px;}
    .table_1_content.title{font-size:35px;}
}

/* 유형 2 */
.word_wrap{background-color:#22bdff; color:#fff; border-radius:20px; padding:20px 35px 15px 35px; margin-bottom:20px;}
.word_caption{font-size:18px; padding:0 0 12px 5px; margin-bottom:5px; border-bottom:1px solid #fff; font-weight:600;}
.word_area{display:flex; flex-wrap:wrap;}
.word{margin:10px 15px; font-size:16px; font-weight:500;}

.word_q_wrap{padding:35px 5px 0 5px;}
.word_q{font-size:23px; font-weight:500; margin-bottom:15px;}
.word_a{display:inline-block; width:100%; background:none; height:50px; border-bottom:1px solid #111; font-size:20px; padding:0 2.5%; font-weight:500; }
.word_a_wrap{display:block; width:100%; background:none; height:50px; font-size:20px; padding:0 2.5%; font-weight:500;}

@media all and (min-width:1440px){
    .word_caption{font-size:19px;}
    .word{margin:10px 16px; font-size:17px;}
}
@media all and (min-width:1680px){
    .word_wrap{border-radius:30px; padding:25px 40px 15px 40px;}
    .word_caption{font-size:20px;}
    .word{margin:10px 20px; font-size:18px;}
    
    .word_q_wrap{padding:40px 10px 0 10px;}
    .word_q{font-size:24px; margin-bottom:20px;}
    .word_a{height:54px; font-size:22px; padding:0 2%;}
	.word_a_wrap{height:54px; font-size:22px; padding:0 2%;}
}

.sentence_wrap{background-color:#5f41e1; color:#fff; border-radius:20px; padding:20px 35px 15px 30px; margin:0 auto; margin-bottom:20px; width:50%;}
.sentence_caption{font-size:18px; padding:0 0 12px 5px; margin-bottom:5px; border-bottom:1px solid #fff; font-weight:600;}
.sentence_area{display:flex; flex-wrap:wrap;}
.sentence_box{line-height:1.8;}
.sentence{margin:8px 15px; font-weight:500; font-size:16px;}

@media all and (min-width:1440px){
    .sentence_caption{font-size:19px;}
    .sentence{font-size:17px;}
}
@media all and (min-width:1680px){
    .sentence_wrap{border-radius:30px; padding:25px 40px 15px 40px; margin-bottom:25px;}
    .sentence_caption{font-size:20px;}
    .sentence_box{line-height:1.9;}
    .sentence{margin:10px 20px; font-size:18px;}
}

/* 유형 3 */
.table_2{border-spacing:8px; width:100%;}
.table_2 th, .table_2 td{border-radius:8px; text-align:center; font-weight:500;}
.table_2 th{background-color:#22bdff; color:#fff; height:52px; font-size:18px;}
.table_2 td{background-color:#fff; height:54px;}
.input_1{display:block; width:100%; height:48px; text-align:center; font-size:18px;}
.input_1::placeholder{color:#ccc; font-weight:300;}

@media all and (min-width:1680px){
    .table_2{border-spacing:10px;}
    .table_2 th, .table_2 td{border-radius:10px;}
    .table_2 th{height:54px; font-size:19px;}
    .table_2 td{height:56px;}
    .input_1{height:50px; font-size:19px;}
}

/* 유형 4 */
.q_1_wrap{display:flex; align-items:center; height:56px; background-color:#fff; border-radius:30px 20px 20px 30px; position:relative; font-size:19px; font-weight:500; padding-left:74px; margin-bottom:20px; line-height:1.3;}
.q_1_num{position:absolute; left:0; top:0; height:100%; width:58px; display:flex; justify-content:center; align-items:center; background-color:#22bdff; color:#fff; border-radius:20px;}

.q_2_wrap{border:2px solid #fff; border-radius:20px; padding:15px 30px; font-size:18px; line-height:1.6; margin-bottom:20px;}

.choose_wrap{padding:0 10px;}

.radio_1{display:none;}
.radio_1_label{cursor:pointer; display:flex; align-items:center; padding:10px 0; font-weight:500; font-size:20px;}
.radio_1_label .radio_1_bullet{width:32px; height:32px; border-radius:40%; background-color:#fff; margin:0 15px;}
.radio_1:checked + .radio_1_bullet{background-image:url(../images/check_1.png); background-repeat:no-repeat; background-position:center; background-size:100%;}

/* 유형 5 GPT */
.gpt_tabs{display:flex; justify-content:flex-end; padding-right:20px; margin-top:-15px;}
.gpt_tab{width:210px; height:42px; border-radius:20px 20px 0 0; margin-left:6px; display:flex; justify-content:center; align-items:center; background-color:#aec2ff; color:#fff; font-size:17px; font-weight:500; padding-top:1px; cursor:pointer;}
.gpt_tab.active{background-color:#fff; color:#1b1d21;}

.gpt_tab.active .gpt_bullet{background-color:#aec2ff;}
.gpt_tab.active .gpt_check:checked + .gpt_bullet{background:url(../images/check_2.png) no-repeat; background-size:cover; background-color:#aec2ff;}

.gpt_check{display:none;}
.gpt_bullet{margin-left:10px; width:24px; height:24px; background-color:#fff; border-radius:40%;}
.gpt_check:checked + .gpt_bullet{background:url(../images/check_1.png) no-repeat; background-size:cover; background-color:#fff;}

.gpt_wrap{background-color:#fff; padding:20px 40px; border-radius:20px; display:none;}

.gpt_top{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; height:42px;}

.gpt_top_left{display:flex; justify-content:center; align-items:center; width:114px; height:36px; position:relative; background-color:#11a27f; border-radius:15px; font-size:13px; color:#fff; font-weight:500;}
.gpt_icon{margin-right:5px;}
.gpt_point{position:absolute; left:18px; bottom:-9px;}

.gpt_top_right{display:flex; align-items:center;}
.gpt_top_step{display:flex; justify-content:center; align-items:center; height:42px; border-radius:15px; background-color:#ffffdb; font-size:16px; font-weight:500; color:#fe7600; transition:0.2s; padding:0 24px;}
.gpt_circle{width:14px; height:14px; border-radius:50%; background-color:#fe7600; margin-right:6px; transition:0.2s;}
.gpt_top_step:hover{background-color:#fe7600; color:#ffffdb;}
.gpt_top_step:hover .gpt_circle{background-color:#ffffdb;}
.gpt_step_arrow{margin:0 12px;}

.gpt_msg_wrap{border:3px solid #11a27f; border-radius:15px; padding:18px 50px 15px 50px;}
.gpt_msg_caption{color:#11a27f; opacity:0.55; font-size:18px; font-weight:500; margin-bottom:5px;}

.gpt_msg{line-height:1.9; font-size:21px; font-weight:500;}
.gpt_blank_1{background:none; border-bottom:1px solid #11a27f; font-size:21px; font-weight:500; margin:0 5px; text-align:center;}
.gpt_blank_2{background:none; border-bottom:1px solid #5f41e1; font-size:19px; font-weight:500; margin:0 5px; text-align:center;}

.gpt_msg_wrap_2{display:flex; margin-top:20px;}
.gpt_answer{position:relative; top:-20px; width:62px; height:104px;}
.gpt_ex{display:flex; justify-content:center; align-items:center; width:68px; color:#5f41e0; font-weight:500; font-size:21px; min-height:138px;}

.gpt_msg_area_2{border-radius:15px; padding:22px 40px 15px 40px; background-color:#f3f6ff; width:calc(100% - 130px);}
.gpt_msg_caption_2{color:#5f41e0; opacity:0.55; font-size:18px; font-weight:500; margin-bottom:5px;}
.gpt_msg_2{line-height:1.9; font-size:19px; font-weight:500;}

.gpt_guide_wrap{background-color:#fff; margin-bottom:20px; border-radius:20px; position:relative; display:flex; justify-content:center; align-items:center; padding:30px 0 20px 0;}
.gpt_guide_caption{position:absolute; right:20px; top:-20px; background-color:#1ca280; color:#fff; display:flex; justify-content:center; align-items:center; z-index:20; height:40px; padding:0 23px; border-radius:30px; font-weight:500; font-size:16px;}
.gpt_guide_icon{margin-right:8px;}
.gpt_guide_area{line-height:1.9; text-align:center; width:25%; background-color:#fffedd; border-radius:16px; padding:15px 0; font-weight:500; position:relative;}
.gpt_guide_arrow{width:100px; display:flex; justify-content:center; align-items:center;}
.gpt_guide_num{display:flex; justify-content:center; align-items:center; position:absolute; width:38px; height:38px; left:-14px; top:-14px; background-color:#fd7420; color:#fffedd; border-radius:50%; font-weight:600; font-size:18px;}

@media all and (min-width:1680px){
    .gpt_wrap{background-color:#fff; padding:40px 60px;}
    .gpt_guide_area{font-size:17px;}
}

/* 유형 비디오 */
.video_iframe{display:block; width:704px; height:396px; margin:0 auto; border:0;}

@media all and (min-width:1440px){  
    .video_iframe{width:816px; height:459px;}
}

/* 참조 */
.reference_container{position:absolute; left:0; top:0; width:100%; height:100%; z-index:0; background-color:#f3f6ff; border-radius:30px;}
.reference_wrap{height:100%; border-radius:30px;}
.lesson_area{display:flex; justify-content:space-between; width:100%;}
.reference_close{position:absolute; right:40px; top:30px; cursor:pointer; transition:0.3s; z-index:100;}
.reference_close:hover{transform:rotate(180deg);}

.reference_wrap.text{font-family:'SCoreDream'; font-size:23px;}
.reference_text_area{height:100%; overflow:auto; padding:3.5% 10%;}
.reference_text_area::-webkit-scrollbar{width:4px;}
.reference_text_area::-webkit-scrollbar-track{background-color:transparent;}
.reference_text_area::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(95,65,225,0.4);}
.reference_text_area::-webkit-scrollbar-button{width:0; height:0;}

.reference_text_title{font-weight:600; font-size:48px; padding-bottom:40px;}
.reference_text_author{text-align:right; padding-bottom:30px;}
.reference_text{line-height:1.8;}

.reference_wrap.video, .reference_wrap.audio{display:flex; justify-content:center; align-items:center;}
.reference_wrap.video .reference_close{top:0; right:-44px;}
.reference_video_area{position:relative; width:768px; height:432px;}
.reference_video{border:0; position:absolute; left:0; top:0; width:100%; height:100%;}

.reference_wrap.img{overflow:hidden; padding:3%;}

.reference_wrap.audio .reference_close{top:0; right:-44px;}
.reference_audio_area{position:relative; display:flex; justify-content:center; align-items:center;}

.reference_wrap.audio .reference_close{top:calc(50% - 12px); right:-64px;}
.reference_audio{cursor:pointer;}
.reference_audio_bg{width:400px; height:8px; background-color:#fff; border-radius:6px; margin:0 25px; position:relative;}
.reference_audio_bar{position:absolute; left:0; top:-2px; height:12px; background-color:#22bdff; border-radius:8px; transition:0.1s;}
.reference_audio_sec{color:#148fff; font-size:30px;}


@media all and (min-width:1440px){    
    .reference_video_area{width:832px; height:468px;}
}
@media all and (min-width:1680px){
    .reference_container, .reference_wrap{border-radius:40px;}
    .reference_video_area{width:928px; height:522px;}
}

/** 수강 신청 **/
.enrollment_wrap{display:flex; justify-content:center; align-items:center; height:100%;}
.enrollment_logo{display:block; margin:0 auto;}
.enrollment_text{text-align:center; color:#2c365a; font-size:32px; padding:45px 0;}
.enrollment_btn{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; width:260px; height:54px; background-color:#22bdff; color:#fff; font-size:22px; margin:0 auto; border-radius:15px; padding-bottom:2px; transition:0.2s;}
.enrollment_btn:hover{background-color:#5f41e1;}

.level_caption{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#4a86ff;}
.level_icon{margin:0 5px -2px 0; }
.level_text{text-align:center; color:#2c365a; font-size:18px; padding:25px 0;}


/** 리스트 **/
.list_wrap{overflow:auto;}
.list_table{width:100%; border-spacing:0; font-size:15px;}
.list_table th{background-color:#5f41e1; color:#fff; height:52px; font-weight:400;}
.list_table thead tr th:first-child{border-radius:20px 0 0 20px;}
.list_table thead tr th:last-child{border-radius:0 20px 20px 0;}
.list_table td{color:#333; height:52px; text-align:center; border-bottom:1px solid rgba(95,75,224,0.05);}
.list_table_btn{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background-color:#4a86ff; color:#fff; width:90px; height:34px; margin:0 auto; border-radius:10px; transition:0.2s; padding-bottom:1px;}
.list_table_btn:hover{background-color:#5f41e1;}
.list_table_btn.gray{background-color:#acacac;}

.list_caption{display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:#333; text-align:left; transition:0.2s;}
.list_caption:hover{color:#5f41e1; text-decoration:underline;}

.bbs_page{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap; padding-top:25px; width:100%;}
.bbs_page img{display:block;}
.bbs_page img.prev{margin-right:10px;}
.bbs_page img.next{margin-left:10px;}
.bbs_page a, .bbs_page span{margin:0 5px;}
.bbs_num{font-size:15px; color:#666; transition:0.2s; width:24px; text-align:center;}
.bbs_num:hover{color:#5f41e1; font-weight:500; opacity:0.85;}
.bbs_num.active{color:#5f41e1; font-weight:500;}

.level_result_view{display:flex; align-items:center; justify-content:flex-end; padding:20px 0 0 0; font-size:15px;}

@media all and (min-width:1680px){
    .list_table, .bbs_num, .level_result_view{font-size:16px;}
    .list_table th{height:58px;}
    .list_table td{height:58px;}
    
    .bbs_page, .level_result_view{padding-top:30px;}
    .bbs_num{width:28px;}
}

/** 읽기 **/
.read_title{text-align:center; line-height:1.3; font-size:26px; padding:5px 0 30px 0; font-weight:500;}
.read_table{width:100%; border-collapse:collapse;}
.read_table th{height:52px; padding-left:30px; text-align:left; border-radius:20px; background-color:#5f41e1; color:#fff; font-weight:500;}
.read_item{margin-right:20px;}
.read_table td{border-bottom:1px solid rgba(95,75,224,0.1); padding:25px 30px; line-height:1.6; text-align:justify;}
.read_table img{display:block; width:100%; max-width:900px; margin:20px auto;}

.button_1.bbs{width:110px; height:40px; font-size:18px;}

/** 쓰기 **/
.write_table{width:100%; border-spacing:10px;}
.write_table th{width:14%; height:52px; border-radius:20px; border:1px solid #e6e6e6; background-color:#fff; font-weight:500; text-align:center;}
.write_table td{background-color:#fff; border-radius:20px; padding:0 15px;}
.write_input{display:block; width:100%; padding:0 15px; height:34px; font-size:16px;}
.write_file{display:block; width:100%; font-size:16px;}
td.write_form{padding:15px;}
td.write_table_pad{padding:20px; border:1px solid #e6e6e6;}
.write_table_date{background-color:#eee; font-weight:500; color:#; padding:14px 25px; border-radius:10px; margin:20px 0 10px 0;}
.write_table_date:first-child{margin-top:0;}
.write_table .radio_bullet{border:1px solid #ccc;}
.write_table_pad .radio_label{margin:8px 20px;}

/** 팝업 **/
.pop_bg{background-color:#f3f6ff;}
.pop_wrap{padding:20px 3%; font-family:'SCoreDream';}
.pop_title{text-align:center; padding-bottom:15px; color:#1b1c20; font-size:24px; font-weight:600; display:flex; justify-content:center; align-items:center;}
.pop_title_c{width:70px; margin-right:20px;}

.pop_wrap.center{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:100%;}

@media all and (min-width:962px){
    .pop_wrap{padding:30px 4%;}
    .pop_title{padding-bottom:25px; font-size:30px;}
}

/** 학습화면 **/
.class_tabs{display:-webkit-box; display:-ms-flexbox; display:flex; padding-left:10px;}
.class_tab{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; margin-right:1px; background-color:#ccc; color:#fff; border-radius:10px 10px 0 0; padding:9px 18px 8px 18px; transition:0.2s;}
.class_tab img{margin-right:6px;}
.class_tab:hover{background-color:#2c365a; opacity:0.9;}
.class_tab.active{background-color:#2c365a;}
.class_tab.off{cursor:default; background-color:#eee;}
.class_tab.off:hover{background-color:#eee;}

.class_img{display:block; width:100%; border-radius:15px; margin-bottom:10px;}
.class_video_wrap{position:relative; padding-top:56.25%; margin-bottom:10px;}
.class_video{position:absolute; left:0; top:0; width:100%; height:100%; border-radius:15px; border:0;}
.class_passage{background-color:#f6f6f6; border-radius:15px; height:220px; overflow:auto; line-height:1.5; padding:10px 15px; font-size:15px; color:#333;}
.class_right{height:220px; border-radius:15px; border:2px solid #a7a3f6; margin-top:10px; padding:10px 15px; overflow:hidden;}
.class_textarea{display:block; width:100%; height:100%; line-height:1.5; color:#333; font-size:20px;}

.class_correction{overflow:auto; height:100%; line-height:1.5; color:#333; font-size:15px;}
.class_rewriting{overflow:auto; height:300px; line-height:1.5; color:#000; font-size:15px; padding:10px 15px; background-color:#f3f6ff; border-radius:15px;}

.text_strike{text-decoration:line-through;}
.text_red{color:#f00;}
.text_blue{color:#00f}
.text_green{color:#0b0;}
.text_bold{font-weight:bold;}

.class_passage::-webkit-scrollbar {
  width:3px;
}
.class_passage::-webkit-scrollbar-track {
  background-color: transparent;
}
.class_passage::-webkit-scrollbar-thumb {
  border-radius:2px; background-color:rgba(0,0,0,0.3);
}
.class_passage::-webkit-scrollbar-button {
  width:0; height:0;
}

.record_btn_wrap{position:absolute; left:0; width:100%; display:-webkit-box; display:-ms-flexbox; display:flex;}
.record_btn_area{display:-webkit-box; display:-ms-flexbox; display:flex;}
.record_btn{cursor:pointer; width:58px; height:58px;}

@media all and (min-width:640px){
    .class_tab{padding:8px 12px 7px 10px;}
    
    .class_wrap{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between;}
    .class_wrap.width{}
    .class_left{width:300px;}
    .class_right{width:calc(100% - 320px); margin:0; height:378px;}
    
    .class_rewriting{height:410px;}
    
    .record_btn_wrap{-webkit-box-pack:center; -ms-flex-pack:center; justify-content:center;}
}
@media all and (min-width:768px){
    .class_tab{padding:9px 18px 8px 18px;}
    
    .class_left{width:390px;}
    .class_right{width:calc(100% - 410px); height:427px;}
    
    .class_rewriting{height:470px;}
}
@media all and (min-width:962px){
    .class_tab{padding:9px 20px 8px 20px;}
    
    .class_left{width:420px;}
    .class_right{width:calc(100% - 440px); height:486px; padding:15px 20px;}
    .class_passage{height:240px; padding:15px 20px; font-size:16px;}
    .class_passage.short{height:486px;}
    .class_textarea, .class_correction{font-size:16px; line-height:1.8;}   
    
    .class_rewriting{height:530px; font-size:16px; line-height:1.8; padding:17px 20px;}

}
@media all and (min-width:1080px){
    .class_tab{padding:10px 22px 9px 22px;}
    
    .class_left{width:510px;}
    .class_right{width:calc(100% - 530px); height:546px;}
    .class_passage{height:250px;} 
    .class_passage.short{height:546px;}
    
    .class_rewriting{height:600px;}

}
@media all and (min-width:1280px){
    .class_tab{padding:11px 25px 10px 25px; font-size:19px;}
    .class_tab img{margin-right:10px;}
    
    .class_left{width:600px;}
    .class_right{width:calc(100% - 620px); height:660px;}
    .class_right.short{height:620px;}
    .class_passage.short{height:620px;}
    
    .class_textarea, .class_correction{line-height:2;}
    
    .class_rewriting{height:660px; font-size:18px; line-height:2;}

}
@media all and (min-width:1680px){
    .class_textarea{font-size:24px;}
}

/** 수강신청 **/
.class_register_caption{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; text-align:center; border:1px solid #ddd; border-radius:10px; height:50px; line-height:1.4;}
.class_register_content{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; padding:15px 0; background-color:#f9f9f9;}
.class_register_content .check_label, .class_register_content .radio_label{margin-right:15px;}

.class_register_content.teacher{-webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap; overflow:auto; height:390px;}
.class_register_content.teacher::-webkit-scrollbar{width:3px;}
.class_register_content.teacher::-webkit-scrollbar-track{background-color:transparent;}
.class_register_content.teacher::-webkit-scrollbar-thumb{border-radius:3px; background-color:rgba(44,54,90,0.65);}
.class_register_content.teacher::-webkit-scrollbar-button{width:0; height:0;}

.class_teacher_wrap{width:48%; margin:2% 0; overflow:hidden; position:relative; border-radius:10px;}
div.radio_label:after{content:''; position:absolute; left:0; top:0; right:0; bottom:0; background-color:rgba(0,0,0,0.55); z-index:10;}
.class_teacher_wrap .radio_label{position:relative; width:100%; padding-top:100%; background-repeat:no-repeat; background-position:center; background-size:cover; border-radius:10px; overflow:hidden;}
.class_teacher_wrap .radio_bullet{position:absolute; margin:0; right:10px; top:10px; background-color:rgba(255,255,255,0.4); border:3px solid #fff; width:24px; height:24px;}

.class_teacher_name{position:absolute; left:0; right:0; bottom:0; height:34px; line-height:34px; text-align:center; border-radius:0 0 10px 10px; background-color:rgba(255,255,255,0.85); color:#2c365a; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding:0 10px;}

.class_teacher_intro{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:40px; border:2px solid #eee; padding:0 8% 0 10%; color:#333; margin-top:5px; transition:0.2s; border-radius:10px}
.class_teacher_intro .icon{width:12px;}
.class_teacher_intro:hover{background-color:#eee;}

@media all and (min-width:640px){
    .class_register_content .check_label, .class_register_content .radio_label{margin-right:25px;}
    
    .class_teacher_wrap{width:31%; margin:1.5% 3% 1.5% 0;}
    .class_teacher_wrap:nth-child(3n){margin-right:0;}
    .class_register_content.teacher{-webkit-box-pack:start; -moz-box-pack:start; -webkit-justify-content:flex-start; justify-content:flex-start;}
}
@media all and (min-width:768px){
    .class_register_wrap{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;}
    .class_register_caption{width:20%; margin:5px 0;}
    .class_register_content{width:79%; margin:5px 0; padding:15px 20px; border-radius:10px; -webkit-box-pack:start; -moz-box-pack:start; -webkit-justify-content:flex-start; justify-content:flex-start;}
    .class_register_content.teacher{padding:5px 12px;}
}
@media all and (min-width:960px){    
    .class_teacher_wrap{width:23.5%; margin:1% 2% 1% 0;}
    .class_teacher_wrap:nth-child(3n){margin-right:2%;}
    .class_teacher_wrap:nth-child(4n){margin-right:0;}
}

/** 폼 공통 **/
.input_common{width:100%; border-radius:10px; height:40px; background-color:#fff; padding:0 15px; color:#1b1d21; font-size:16px;}
.select_common{width:100%; border-radius:10px; height:40px; background-color:#fff; padding:0 15px; color:#1b1d21; font-size:16px;}
.text_common{width:100%; border-radius:10px; height:150px; background-color:#fff; padding:10px 15px; color:#1b1d21; font-size:16px; line-height:1.6;}

@media all and (min-width:768px){
    .select_common{width:200px;}
}

.file_add_wrap{width:300px; height:48px; position:relative;}
.file_add_input{width:240px; height:48px; background-color:#f4f4f4; border-radius:10px; border:0; padding:0 15px;}
.file_add_hidden{position:absolute; left:250px; top:0; width:50px; height:100%; opacity:0; cursor:pointer; z-index:20;}
.file_add_btn{position:absolute; right:0; top:0; width:50px; height:48px; border-radius:10px; background-color:#2da7fa; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; z-index:10;}
.file_add_btn_icon{width:30px;}

.button_1.upload{width:150px; height:48px; font-size:18px;}

/** 마이페이지 **/
.account_table{display:flex; flex-wrap:wrap; justify-content:space-between; max-width:1280px; margin:0 auto; font-size:14px;}
.account_table > li{width:100%; margin-bottom:10px; font-family:'SCoreDream'; background-color:#fff; border:1px solid #e2e2e2; border-radius:10px; display:flex; min-height:42px;}
.account_table li.full{width:100%;}
li.account_blue .account_input{background-color:#0562ff; color:#fff;}
li.account_blue .account_input::placeholder{color:#fff;}
li.account_blue .account_input:focus::-webkit-input-placeholder{color:transparent;}
li.account_blue .account_input:focus:-moz-placeholder{color:transparent;}
li.account_blue .account_input:focus::-moz-placeholder{color:transparent;}
li.account_blue .account_input:focus:-ms-input-placeholder{color:transparent;}
.account_table > li:last-child{margin-bottom:0;}
.account_caption{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; font-weight:400; width:120px; height:100%; padding-left:10px; position:relative;}
.account_caption:after{content:''; position:absolute; right:0; top:10px; bottom:10px; width:1px; background-color:#e2e2e2;}

.account_content{width:calc(100% - 120px); padding:0 5px;}
.account_input{display:block; width:100%; height:40px; background-color:#fff; color:#111; padding:0 15px; border-radius:15px; font-size:14px;}
.account_input::placeholder{color:#aaa;}
.account_input.blue::placeholder{color:#0562ff;}
.account_input.blue{color:#0562ff;}

.account_input.id{width:250px;}

.account_content.gender{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background-color:#fff; border-radius:15px; height:50px;}
.radio_label.gender:first-of-type{margin-right:25px;}
.radio_label.gender .radio_bullet{background-color:#fff; width:22px; height:22px; border:0; border-radius:50%; margin:0 0 0 10px; transition:0.2s; border:1px solid #ddd;}

.account_content.birth{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}

.account_select.year{width:32%;}
.account_select.month{width:31%;}
.account_select.day{width:31%;}

.account_select{display:block; width:100%; height:40px; background-color:#fff; color:#111; border-radius:20px; font-size:14px; text-align:center;}

.account_content.birth .account_select{margin-right:10px;}

.account_content.email{display:flex; align-items:center; flex-wrap:wrap; padding-top:5px; padding-bottom:5px;}
.account_input.mail_1{width:100%; background-color:#f6f6f6; margin-bottom:5px;}
.account_input.mail_2{width:100%; background-color:#f6f6f6; margin:5px 0;}
.account_select.mail_3{width:100%; background-color:#f6f6f6; margin-bottom:5px;}
.account_confirm{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border:1px solid #0562ff; border-radius:15px; color:#0562ff; height:38px; width:140px; transition:0.2s;}
.account_confirm:hover{background-color:#0562ff; color:#fff;}

.account_content.level{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:100%; padding:0 0;}
.account_level{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; padding:0 2px;}
.account_level li{background-color:#cdcdcd; color:#fff; border-radius:50%; margin:0 1px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; transition:0.2s; width:20px; height:20px; font-size:11px; cursor:pointer;}
.account_level .active{background-color:#5f41e0; color:#fff;}
.account_content_level_bad, .account_content_level_good{display:none;}

.check_label.account{color:#414141; padding:10px 0 0 3%;}
.check_link.account{color:#6d63cb; padding-left:6px;}

@media all and (min-width:1024px){   
    .account_table{font-size:16px;}
    .account_table > li{width:49%; min-height:52px; margin-bottom:15px;}
    
    .account_caption{width:170px; margin-bottom:10px; padding-left:30px;}
    .account_content{width:calc(100% - 170px); padding:0 15px;}
    .account_input{height:50px; font-size:16px;}
    .account_select{height:50px; font-size:16px;}
    
    .account_content.email{padding:0 15px;}
    .account_input.mail_1{width:150px; background:none;}
    .account_input.mail_2{width:150px; background:none;}
    .account_select.mail_3{width:150px; background:none;}
    
    .account_content_level_bad, .account_content_level_good{display:block;}
    .account_content.level{padding:0 20px;}
    .account_level{padding:0 20px;}
    .account_level li{margin:0 8px; width:28px; height:28px; font-size:13px; padding-top:1px;}
}

/* 아아디/비번 찾기 */
.member_wrap{padding:20px 2%;}

.search_tabs{display:flex; justify-content:space-between;}
.search_tabs a{width:49%; padding:15px 0; text-align:center; background-color:#eee; color:#1c1d21; border-radius:10px; transition:0.2s;}
.search_tabs a:hover{background-color:#77caf6; color:#fff;}
.search_tabs .active{background-color:#22bdff; color:#fff;}

/** 휴대폰 인증 **/
.authentication_wrap{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:100%; padding:0 3%;}
.authentication_center{width:100%; width:520px;}

.authentication_logo{display:block; width:50%; max-width:275px; margin:0 auto 10% auto; }
.authentication_title{font-size:32px; padding-bottom:35px; text-align:center; color:#1c1d21;}

.authentication_text{line-height:1.6; padding:0 0 20px 0; font-size:16px; color:#666; text-align:center; font-weight:400; margin-top:-10px;}
.authentication_area{background-color:#f3f6ff; padding:20px 15px; color:#000; font-size:14px; border-radius:18px; width:100%; line-height:1.4;}
.authentication_all_wrap{border-bottom:1px solid #d9d9d9; padding-bottom:15px;}
.authentication_box{display:-webkit-box; display:-ms-flexbox; display:flex; margin-top:12px;}
.authentication_area .check_bullet{border-radius:40%; border:2px solid #ddd; width:24px; height:24px; margin-bottom:-1px;}

.btn_detail{display:inline-block; width:60px; height:28px; line-height:26px; text-align:center; background-color:#fff; color:#000; font-size:14px; margin-left:15px; border-radius:20px; border:1px solid #ccc;}

/** 약관 **/
.provision_container{padding:28px 28px 0 28px; height:100%;}
.provision_wrap{height:calc(100% - 70px);}
.provision_area{padding:15px 20px; overflow:auto; border:1px solid #eee; height:100%; color:#555; line-height:1.8; margin-bottom:20px; text-align:justify; word-break:break-all; background-color:#fafafa; font-size:14px; border-radius:4px;}
.agree_title{text-align:center; padding-bottom:20px; font-weight:500; font-size:24px;}
.provision_area h4{font-size:16px; padding:15px 0 0 0; color:#333; font-weight:500;}
.provision_area b{font-size:15px; padding:10px 0 5px 0; color:#444; display:block; font-weight:500;}

/** 레벨테스트 **/
.level_test_wrap{height:100%; display:flex; justify-content:center; align-items:center;}
.level_test_area{width:250px; height:250px; border-radius:40px; background-color:#fff;  border:2px solid #eee; margin:0 15px; display:flex; justify-content:center; align-items:center; text-align:center;}
.level_logo{display:block; width:55%; margin:0 auto;}
.level_test_caption{padding:15px 0 20px 0; font-weight:400; font-size:24px;}
.level_test_btn{display:block; width:160px; height:42px; font-size:16px; background-color:#22bdff; color:#fff; border-radius:10px; display:flex; justify-content:center; align-items:center; margin:0 auto; transition:0.2s;}
.level_test_btn:hover{background-color:#5f41e1;}
.level_test_btn.off{cursor:default; background-color:#ccc;}
.level_test_btn.off:hover{background-color:#ccc;}
.level_test_btn_icon{margin-right:7px;}

.quiz_box_wrap{height:100%; position:relative;}
.quiz_box_iframe{width:calc(100% - 180px); height:100%; border:0; display:block; position:relative;}

.q_3_wrap{border:2px solid #fff; border-radius:20px; padding:20px 35px; font-size:24px; line-height:1.8; margin-bottom:20px; font-weight:500;}
.level_blank{border-bottom:1px solid #111; margin:0 5px; display:inline-block;}

.input_wrap{padding:30px 0 0 0;}
.input_3{width:100%; height:60px; padding:0 30px; border-radius:10px; font-size:20px;}

.level_start{height:100%; display:flex; align-items:center; justify-content:center;}
.level_start_logo{display:block; margin:0 auto;}
.level_start_text{font-size:24px; text-align:center; padding:30px 0 60px 0;}

@media all and (min-width:768px){  
    .authentication_wrap{padding:0;}
    .authentication_area{padding:30px 35px; font-size:17px;}
    .authentication_text{font-size:17px;}
}
@media all and (min-width:1024px){  
    .member_wrap{padding:4%;}
}
@media all and (min-width:1680px){    
    .level_test_area{width:300px; height:280px; font-size:30px; margin:0 25px;}
    .level_test_caption{padding:20px 0 25px 0;}
    .level_test_btn{font-size:17px; padding-bottom:1px; width:170px; height:44px;}
    
    .level_start_text{font-size:28px; padding:40px 0 80px 0;}
}

.result_check{position:absolute;}

/** 답안 체크 **/
.answer_wrap{position:absolute; right:0; top:0; width:180px; height:100%; display:flex; align-items:center;}
.answer_area{width:100%; display:-webkit-box; display:-ms-flexbox; display:flex;}

.answer_box{padding:0 4px; width:100%;}
.answer_row{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; -webkit-box-align:center; -ms-flex-align:center; align-items:center; height:38px; background-color:#f7f7f7; border-radius:8px; width:100%; margin-bottom:4px; transition:0.2s; cursor:pointer; position:relative;}
.answer_row:hover{background-color:#bdcdff;}
.answer_number{width:48%; font-weight:700; text-align:right; font-size:17px;}
.answer_label{width:52%;}
.answer_check{display:none;}
.answer_bullet{display:block; width:22px; height:22px; margin:0 auto; background-color:#fff; border-radius:30%;}
.answer_check:checked + .answer_bullet{background:url(../images/check_1.png) no-repeat; background-size:cover; background-color:#fff;}

.answer_row.current{background-color:#fff; border:1px solid #5f41e1;}
.answer_row.current .answer_bullet{background-color:#5f41e1;}
.answer_row.current .answer_check:checked + .answer_bullet{background:url(../images/check_3.png) no-repeat; background-size:cover; background-color:#5f41e1;}

.last_week_icon{background-repeat:no-repeat; background-size:cover; background-color:#24b8fe; background-size:cover; border-radius:20px; width:48px; height:48px; margin-right:18px;}
.diary_top, .mail_top, .paper_top, .speech_point, .speech_c, .gpt_point_2, .gpt_c{display:none;}

.study_area.type_1 .study_box, .study_area.type_2 .study_box, .study_area.type_3 .study_box, .study_area.type_4 .study_box, .study_area.type_5 .study_box, .study_area.type_6 .study_box, .study_area.type_7 .study_box{padding:2% 3%;}

@media all and (min-width:1680px){ 
    .study_area.type_1 .study_box, .study_area.type_2 .study_box, .study_area.type_3 .study_box, .study_area.type_4 .study_box, .study_area.type_5 .study_box, .study_area.type_6 .study_box, .study_area.type_7 .study_box{padding:2% 4%;}
}

/* 에세이 */
.study_area.type_1 .study_bg{background:url(../images/essay_bg.png) repeat-y; position:absolute; left:-15px; top:10px; bottom:10px; width:46px;}
.study_area.type_1 .study_box{background:none; padding:40px 3% 20px 3%; padding-left:3%;}
.study_area.type_1 .study_inner{height:calc(100% - 60px); width:1160px;}
.study_area.type_1 .table_1{width:100%;}
.study_area.type_1 .table_1, .study_area.type_1 .table_1_content, .study_area.type_1 .textarea_1{height:100%;}

.study_area.type_1 .last_week_icon{background-image:url(../images/essay_icon.png);}

.study_area.type_1 .study_tip_2{right:0;}

@media all and (min-width:1440px){  
    .study_area.type_1 .study_inner{margin:0 auto; width:1220px;}
}
@media all and (min-width:1680px){  
    .study_area.type_1 .study_bg{top:20px; bottom:20px;}
    .study_area.type_1 .study_box{padding:40px 4% 30px 4%;}
}

/* 리포트 */
.study_area.type_2{padding-top:25px;}
.study_area.type_2 .study_bg{background:url(../images/report_bg.png) repeat-x; position:absolute; top:-15px; left:10px; right:10px; height:46px;}
.study_area.type_2 .study_box{background:none; padding:40px 3% 20px 3%;}
.study_area.type_2 .study_inner{height:calc(100% - 60px); width:1160px; margin:0 auto;}
.study_area.type_2 .table_1{width:100%;}
.study_area.type_2 .table_1, .study_area.type_2 .table_1_content, .study_area.type_2 .textarea_1{height:100%;}

.study_area.type_2 .last_week_icon{background-image:url(../images/report_icon.png);}

.study_area.type_2 .study_tip_2{right:0;}

@media all and (min-width:1440px){  
    .study_area.type_2 .study_inner{margin:0 auto; width:1220px;}
}
@media all and (min-width:1680px){  
    .study_area.type_2{}
    .study_area.type_2 .study_bg{left:25px; right:20px;}
    .study_area.type_2 .study_box{padding:40px 4% 30px 4%;}
}

/* 일기 */
.study_area.type_3{overflow:hidden;}
.study_area.type_3 .study_bg{background-color:#d5ddf4; position:absolute; left:0; top:0; bottom:0; width:20px;}
.study_area.type_3 .study_box{background:none; padding:40px 3% 20px 3%; padding-left:4.5%;}
.study_area.type_3 .study_inner{height:calc(100% - 60px); width:1160px; margin:0 auto;}
.study_area.type_3 .table_1{height:calc(100% - 40px); width:100%;}
.study_area.type_3 .table_1_content, .study_area.type_3 .textarea_1{height:100%;}

.study_area.type_3 .last_week_icon{background-image:url(../images/diary_icon.png);}

.study_area.type_3 .diary_top{display:flex; justify-content:center; align-items:center;}
.diary_date{font-size:18px; font-weight:500;}
.diary_date_caption{margin-right:10px;}
.diary_icon{width:40px; margin-left:25px;}

.study_area.type_3 .study_tip_2{right:0;}

@media all and (min-width:1440px){  
    .study_area.type_3 .study_bg{width:30px;}
    .study_area.type_3 .study_inner{margin:0 auto; width:1220px;}
    .study_area.type_3 .table_1{height:calc(100% - 50px);}
    .diary_icon{width:50px;}
}
@media all and (min-width:1680px){
    .study_area.type_3 .study_box{padding:40px 4% 30px 4%;}
    
    .study_area.type_3 .table_1{height:calc(100% - 60px);}
    .diary_date{font-size:22px;}
    .diary_icon{width:60px;}
}

/* 이메일 */
.study_area.type_4 .study_bg{display:none;}
.study_area.type_4 .study_box{background:none; padding:40px 3% 20px 3%;}
.study_area.type_4 .study_inner{height:calc(100% - 60px); width:1160px; margin:0 auto;}
.study_area.type_4 .table_1{width:100%;}
.study_area.type_4 .table_1, .study_area.type_4 .table_1_content, .study_area.type_4 .textarea_1{height:100%;}

.study_area.type_4 .last_week_icon{background-image:url(../images/mail_icon_1.png);}

.study_area.type_4 .mail_top{display:flex; justify-content:space-between; align-items:center; margin-bottom:20px;}
.mail_wrap{width:49%; background-color:#ccc; display:flex; align-items:center; border-radius:12px; color:#fff;}
.mail_caption{display:flex; align-items:center; font-weight:500; padding:0 25px; position:relative;}
.mail_caption:after{content:''; position:absolute; right:0; top:15px; bottom:15px; width:1px; background-color:#fff;}
.mail_content{padding-left:25px;}

.study_area.type_4 .study_tip_2{right:0;}

@media all and (min-width:1440px){ 
    .study_area.type_4 .study_inner{margin:0 auto; width:1220px;}
}
@media all and (min-width:1680px){  
    .study_area.type_4 .study_bg{top:20px; bottom:20px;}
    .study_area.type_4 .study_box{padding:40px 4% 30px 4%;}
}

/* 기사 */
.study_area.type_5{background-color:#f0f0f0;}
.study_area.type_5 .study_bg{display:none;}
.study_area.type_5 .study_box{background:none; padding:40px 3% 20px 3%;}
.study_area.type_5 .study_inner{height:calc(100% - 60px); width:1160px; margin:0 auto;}
.study_area.type_5 .table_1{width:100%;}
.study_area.type_5 .table_1, .study_area.type_5 .table_1_content, .study_area.type_5 .textarea_1{height:100%;}
.study_area.type_5 .textarea_1{background-image:url(../images/line_paper.png);}

.study_area.type_5 .last_week_icon{background-image:url(../images/paper_icon.png);}
.study_area.type_5 .diary_top, .study_area.type_5 .mail_top{display:none;}

.study_area.type_5 .paper_top{font-family:'twaysky'; text-align:center; font-size:30px; letter-spacing:1.5px; padding-bottom:15px; border-bottom:4px solid #ccc; position:relative; margin-bottom:15px; display:block; padding-top:5px;}
.paper_top:after{content:''; position:absolute; bottom:-11px; left:0; width:100%; height:2px; background-color:#ccc;}

.study_area.type_5 .study_tip_2{right:0;}

@media all and (min-width:1440px){  
    .study_area.type_5 .paper_top{font-size:32px;}
    .study_area.type_5 .study_inner{margin:0 auto; width:1220px;}
}
@media all and (min-width:1680px){  
    .study_area.type_5 .study_bg{top:20px; bottom:20px;}
    .study_area.type_5 .study_box{padding:40px 4% 30px 4%;}
    .study_area.type_5 .paper_top{font-size:36px; padding-bottom:15px; border-bottom:5px solid #ccc; margin-bottom:20px; padding-top:10px;}
    .study_area.type_5 .paper_top:after{bottom:-12px; }
}

/* 스피치 */
.study_area.type_6 .study_bg{display:none;}
.study_area.type_6 .study_box{background:none; padding:40px 3% 0 3%;}
.study_area.type_6 .study_inner{height:calc(100% - 60px); width:1280px; margin:0 auto;}
.study_area.type_6 .table_1{height:calc(100% - 70px); width:100%;}
.study_area.type_6 .table_1_content, .study_area.type_6 .textarea_1{height:100%;}

.study_area.type_6 .table_1{background-color:#fff; padding:5px 20px; border-radius:20px; position:relative;}
.study_area.type_6 .speech_point{position:absolute; bottom:-30px; right:130px; height:30px; display:block;}
.study_area.type_6 .speech_c{position:absolute; width:120px; right:0; bottom:-70px; display:block;}

.study_area.type_6 .last_week_icon{background-image:url(../images/speech_icon.png);}
.study_area.type_6 .diary_top, .study_area.type_6 .mail_top, .study_area.type_6 .paper_top{display:none;}

.study_area.type_6 .study_tip_2{right:0;}

@media all and (min-width:1440px){  
    .study_area.type_6 .study_inner{margin:0 auto;}
    .study_area.type_6 .table_1{border-radius:30px; padding:20px 25px;}
    .study_area.type_6 .speech_point{right:145px;}
    .study_area.type_6 .speech_c{width:130px; bottom:-70px;}
}
@media all and (min-width:1680px){    
    .study_area.type_6 .study_box{padding:40px 4% 0 4%;}
    .study_area.type_6 .study_inner{width:1340px;}
    .study_area.type_6 .table_1{padding:20px 50px;}
    .study_area.type_6 .speech_point{bottom:-35px; right:150px; height:35px;}
    .study_area.type_6 .speech_c{width:135px; bottom:-65px;}
}

/* GPT */
.study_area.type_7 .study_bg{display:none;}
.study_area.type_7 .study_box{background:none; padding:40px 3% 0 3%;}
.study_area.type_7 .study_inner{height:calc(100% - 60px); width:1120px; margin:0 auto;}
.study_area.type_7 .table_1{height:calc(100% - 70px); width:100%;}
.study_area.type_7 .table_1_content, .study_area.type_7 .textarea_1{height:100%;}

.study_area.type_7 .table_1{background-color:#fff; padding:5px 60px; border-radius:20px; position:relative;}
.study_area.type_7 .gpt_point_2{position:absolute; bottom:-30px; right:120px; height:30px;  display:block;}
.study_area.type_7 .gpt_c{position:absolute; width:106px; right:0; bottom:-70px; display:block;}

.study_area.type_7 .last_week_icon{background-image:url(../images/gpt_icon_1.png);}
.study_area.type_7 .diary_top, .study_area.type_7 .mail_top, .study_area.type_7 .paper_top{display:none;}

.study_area.type_7 .study_tip_2{right:0; z-index:10000;}

@media all and (min-width:1440px){  
    .study_area.type_7 .table_1{border-radius:30px; padding:20px 60px;}
}
@media all and (min-width:1680px){      
    .study_area.type_7 .study_box{padding:40px 4% 0 4%;}
    .study_area.type_7 .study_inner{width:1160px;}
    .study_area.type_7 .table_1{padding:20px 80px;}
    .study_area.type_7 .gpt_point_2{bottom:-35px; right:120px; height:35px;}
}

/* 학습 flow */
.flow_wrap{background-color:#f3f6ff; border-radius:36px; padding:45px 50px 50px 50px; margin-bottom:50px;}
.flow_wrap:last-child{margin-bottom:10px;}
.flow_title{font-size:30px; color:#5f41e1; padding:0 0 28px 10px;}
.flow_list{display:flex; justify-content:space-between;}
.flow_list li{width:30%;}
li.flow_arrow{width:5%;}
.flow_arrow_wrap{height:140px; display:flex; justify-content:center; align-items:center;}
.flow_area{color:#fff; text-align:center; display:flex; justify-content:center; align-content:center; flex-wrap:wrap; height:140px; border-radius:30px;}
.flow_caption{width:100%; font-weight:500; padding-top:14px; font-size:17px;}
.flow_bg_1{background-color:#22bdff;}
.flow_bg_2{background-color:#0562ff;}
.flow_bg_3{background-color:#5f41e1;}
.flow_text{text-align:center; padding-top:15px; line-height:1.6; font-size:13px; font-weight:500;}

@media all and (min-width:1440px){  
    .flow_wrap{margin-bottom:55px;}
    .flow_list li{width:29%;}
    li.flow_arrow{width:6.5%;}
    .flow_caption{font-size:18px;}
    .flow_text{padding-top:20px; font-size:15px;}
}