
@media (min-width:1280px){
    .mobile-bottom,
    .mobilenav,
    .sidenav-mobile{
        display: none !important;
    }
}
@media(min-width:1561px){
    .respone-leftbutton{
        display: none !important;
    }
}

/* ----------------------마이페이지 해상도------------------ */
@media all and (min-width:1024px) and (max-width:1900px){
    .mypageContent{
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 10px;
    }
    /* 단어시험 */
    .voca-box{
        width: calc(100%/3 - 10px);
    }
    .voca-box02 .progress{
        height: 24px;
    }
    .mypageContent-bottom-bg{
        padding: 30px 0;
    }
    .notebookDisplay{
        max-width: 1422px;
        margin-top: 20px;
    }
    /* 스피킹/라이팅 첨삭 */
    .mypage-speaking-overbox{
        overflow: auto;
    }
    .mypage-speaking-scrollbox{
        width: auto;
    }
    /* 인강 */
    .reading_basic-table tbody tr td{
        font-size: 14px;
    }
    .reading-basic-t02-min1422{
        padding-bottom: 0 !important;
    }
    .reading-intermediate-div{
        width: calc(100%/2 - 15px);
    }
    /* 어셔출판 교재별 프로그램 안내 */
    .arti-speaking-box{
        width: calc(100%/3 - 12px);
    }
    /* 구매내역 */
    .correct-bg{
        background-size: cover;
        background-position:center;
    }
    /* ----------------------------수강후기----------------------- */
    .write-list-content{
        width: 1000px;
        margin-left: 260px;
    }
    .memor-content-top{
        margin-bottom: 70px;
    }
    .w1175{
        width: 1000px;
    }
}
/* 노트북 & 테블릿 가로 (해상도 1024px ~ 1560px)*/ 
@media all and (min-width:1024px) and (max-width:1560px){
    .eventble{
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    .mobile-bottom,
    .mobilenav,
    .sidenav-mobile{
        display: none !important;
    }
    .footerbox{
        padding-left: 20px;
        padding-right: 20px;
    }
    .footer-flex > div:nth-child(1){
        margin-right: 30px;
    }
    .footer-info02 ul li{
        line-height: 22px;
    }
    .footer-phonetime{
        line-height: 24px;
    }
    /* 헤더 */
    .header-phone{
        padding: 0 20px;
    }
    .header-menu{
        padding: 0 20px;
        height: auto;
    }
    .logo img{
        width: 186px !important;
    }
    nav.dropmenu{
        margin-left: 30px !important;
    }
    .dropmenu li.first-li{
        width: auto !important;
    }
    .dropmenu a{
        font-size: 16px !important;
        margin-right: 20px !important;
    }
    /* 각 항목 메뉴 */
    .mainnew-leftmenu{
        display: none;
    }
    /* 컨텐츠 */
    .mainnew{
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    /* ---------------------------소개---------------------  */
    /* 단어시험 */
    .mobile-w100,
    .mevent{
        width: 100% !important;
    }
    .interval-box{
        width: 100%;
    }
    .program-introword{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .interval-box-p{
        font-size: 20px;
    }
    .word-butzip{
        flex-wrap: wrap;
        margin-top: 20px;
    }
    .word-butzip button{
        margin-top: 10px;
    }

    /* ---------------------------인강---------------------  */
    .mainnew-graybox{
        padding: 0 20px;
    }
    .main_blueprint02-title{
        width: 59% !important;
    }
     /* ---------------------------프로그램 안내---------------------  */
    /* 문법 */
    .voca-nav-div button{
        width: auto !important;
        font-size: 16px;
    }
     /* ---------------------------구매하기---------------------  */
    .product-content{
        padding: 0 20px;
    }

     /* ---------------------------마이페이지---------------------  */
    .notebookDisplay{
        padding: 0 20px;
    }
    .footerbox{
        margin-top: 50px;
    }
    /* -----------------------------수강후기-------------------------- */
    .tagbox{
        display: flex;
        top: 124px;
        left: 226px;
        width: calc(100% - 228px);
    }
    .tagbox-tagmobox{
        height: 53px;
        border-radius: 0;
    }
    .tag-deletebutbox{
        width: 140px;
    }
    .tagbox .tagboxbut{
        height: 53px;
        border-radius: 0;
    }
    .today-table tbody tr td{
        font-size: 13px;
    }
    .today-table tr.on .onnum{
        font-size: 18px;
    }
    .today-new{
        width: 42px;
        height: 22px;
        font-size: 12px;
        line-height: 22px;
    }
}

/* 테블릿 가로 (해상도 768px ~ 1023px)*/
@media all and (min-width:768px) and (max-width:1023px){
    .eventble{
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    .book-teacherContent{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .footer-flex{
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-bottom: 110px !important;
    }
    /* pc메뉴 없애기 */
    .header-menu .dropmenu,
    .mainnew-leftmenu{
        display: none;
    }
    .mobilenav{
        display: none !important;
    }
    .mobile-w100,
    .mevent,
    .c100,
    .eventimg img{
        width: 100% !important;
    }
    .respone-leftbutton{
        display: none;
    }
    /* 헤더 */
    .header-phone,
    .header-menu{
        padding: 0 20px;
    }
    .logo img{
        width: 270px !important;
    }
    
    /* 메인 */
    .mainnew{
        width: 100%;
    }
    /* ---------------소개-------------- */
    /* 단어시험 */
    .word-butzip{
        flex-wrap: wrap;
    }
    .word-butzip button{
        margin-top: 10px;
    }
    .interval-box{
        width: 100%;
    }
    .interval-big-p{
        font-size: 40px;
    }
    .interval-box-ul li{
        font-size: 17px;
    }
    .program-introword{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .mainnew-h2{
        font-size: 30px;
    }
    /* --교재-- */
    .book-teacherContent-right > div:nth-child(1){
        width: 200px;
    }
    .book-teacherContent-classname{
        font-size: 20px;
        line-height: 24px;
    }
    /* --인강-- */
    .four-butbox li{
        width: calc(100%/4) !important;
    }
    .four-butbox li button{
        width: 100% !important;
    }
    /* 어셔 출판 교재별 프로그램 안내 */
    .voca-nav-div{
        width: 100%;
        flex-wrap: wrap;
        gap: 10px;
        background-color: transparent;
    }
    .voca-nav-div button{
        color: #131415;
        border: 1px solid #e0e0e0;
    }
    .voca-nav-div li{
        width: calc(100%/5 - 10px);
    }
    .voca-nav-div button{
        font-size: 15px;
    }
    .voca-nav-div li button{
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }
    .voca-nav-div button.active{
        background-color: #4A6CF7 !important;
        color: #fff !important;
    }
    .voca-nav-div button:hover{
        color: #4A6CF7;
    }
    .program-but-nump{
        background-color: #4A6CF7;
        color: #fff;
        width: 22px;
        height: 22px;
        line-height: 22px;
        font-size: 13px;
    }
    .nav-link.active .program-but-nump{
        background-color: #fff !important;
        color: #4A6CF7 !important;
        border: none !important;
    }
    /* 프로그램 라이팅 */
    .program-chump{
        font-size: 20px;
        line-height: 32px;
    }
}
/* 모바일 가로 & 테블릿 세로 (해상도 767px)*/
@media (max-width:767px){
    /* pc메뉴 없애기 */
    .header-menu .dropmenu,
    .respone-leftbutton,
    .mainnew-leftmenu{
        display: none;
    }
    
    .pcnav{
        display: none !important;
    }
    .mainnew{
        padding-top: 20px;
    }

    .mainnew-h2{
        font-size: 22px;
        word-break: keep-all;
        line-height: 32px;
        margin-bottom: 12px !important;
        padding: 0 20px;
    }
    
    /* 헤더 */
    .header-phone{
        padding: 10px 15px;
    }
    .header-menu{
        padding: 10px 15px;
        height: auto;
    }
    .logo img{
        width: 140px !important;
    }
    .top-counselbut,
    .top-kakaocounselbut{
        display: none;
    }
    .header-phone{
        height: 50px;
        line-height: 30px;
    }
    .login-but{
        padding: 9px 11px;
    }
    /* 푸터 */
    .footerbox{
        margin-top: 40px;
    }
    .footer-flex{
        padding: 30px 15px;
        padding-bottom: 94px;
    }
    .footer-flex{
        display: block;
    }
    .footer-phonetime{
        font-size: 12px;
    }
    .footer-num{
        font-size: 20px;
        margin-top: 15px;
    }
    .footer-info02 ul li{
        line-height: 20px;
    }
    /* 사이드메뉴 */
    .sidenav-mobile{
        box-shadow: none;
    }
    .sidenav-mobile-titlebox{
        padding-bottom: 14px;
        padding-top: 12px;
    }
    .mobile-title{
        font-size: 16px;
    }
    .sidenav-mobile .closebtn{
        font-size: 20px;
    }
    .mainmenu{
        padding-top: 12px;
        padding-bottom: 12px;
    }
    /* 전체 버튼 */
    .word-butzip{
        flex-wrap: wrap;
        margin-top: 20px;
        margin-bottom: 0;
        padding-left: 15px;
        padding-right: 15px;
    }
    .word-butzip button{
        width: 100% !important;
        margin-right: 0 !important;
        font-size: 16px;
        margin-top: 6px;
        padding: 0 10px !important;
        height: 42px;
        line-height: 42px;
    }
    /* ----------소개--------- */
    .interval-big-p{
        font-size: 20px;
        margin-bottom: 20px;
    }
    .interval-box-p{
        font-size: 16px;
        line-height: 23px;
    }
    .program-introword{
        padding: 0 15px !important;
        padding-bottom: 10px !important;
    }
    .interval-box{
        width: 100%;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .wordprogram-videobut img{
        width: 100% !important;
    }
    .wordprogram-videobut:after{
        width: 187px;
        height: 129px;
    }
    .interval-box-ul li{
        font-size: 14px;
        padding: 13px 10px;
        line-height: 22px;
    }
    .program-videobut{
        right: 0;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
    }
    .introduce-reading{
        font-size: 16px;
        line-height: 26px;
    }
    .p0z{
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    /* 교재 */
    .mainnew{
        width: 100% !important;
    }
    .mobile-w100,
    .mevent,
    .c100,
    .eventimg img{
        width: 100% !important;
    }
    .eventble{
        padding: 50px 15px !important;
    }
    .mainnew-graybox{
        margin-top: 20px;
    }

    .book-teacherContent-title{
        font-size: 20px;
        padding-left: 15px;
    }
    .book-teacherContent-box{
        margin-top: 15px;
    }
    .book-teacherContent-box li{
        padding-left: 15px;
        padding-right: 0;
    }
    .book-teacherContent-teacher img{
        width: 80px;
    }
    .book-teacherContent-classname{
        font-size: 17px;
    }
    .book-teacherContent-right{
        display: block;
    }
    .book-teacherContent-button{
        width: 72px;
        height: 30px;
        margin-right: 0px;
        font-size: 13px;
    }
    .book-teacherContent-right > div:nth-child(2){
        margin-top: 10px;
    }
    .introduce-reading-warn{
        font-size: 16px;
        line-height: 24px;
    }
    
    /* 인강 */
    .bluetablebox{
        padding-left: 15px;
        padding-right: 15px;
    }
    .bluetable tbody tr td{
        font-size: 13px;
        line-height: 20px;
    }
    .bluetable tbody tr td:nth-child(2){
        padding: 10px !important;
        line-height: 22px;
    }
    .reading-basic-title{
        font-size: 24px !important;
        line-height: 34px !important;
    }
    .reading-basic-gray,
    .eventimg{
        padding: 30px 15px !important;
    }
    .mobile-w100{
        border-radius: 10px !important;
        margin-top: 10px !important;
    }
    .internetreadingbut{
        margin: 20px 0;
    }
    .eventimg{
        margin-top: 0 !important;
    }
    .reading-basic-gray-mt{
        margin-top: 0px !important; 
    }
    /* 어셔 출판 교재별 프로그램 안내 */
    .voca-nav-div{
        width: 100%;
        flex-wrap: wrap;
        gap: 10px;
        background-color: transparent;
    }
    .voca-nav,
    .voca-nav-div{
        display: flex;
        justify-content: flex-start;
    }
    .voca-nav-div button{
        color: #131415;
        border: 1px solid #e0e0e0;
        background-color: #fff;
    }
    .voca-nav-div li{
        width: calc(100%/2 - 5px);
    }
    .voca-nav-div button{
        font-size: 15px;
        line-height: 22px;
    }
    .voca-nav-div li button{
        width: 100% !important;
        padding-left: 0;
        padding-right: 0;
    }
    .voca-nav-div button.active{
        background-color: #4A6CF7 !important;
        color: #fff !important;
    }
    .voca-nav-div button:hover{
        color: #4A6CF7;
    }
    .program-but-nump{
        background-color: #4A6CF7;
        color: #fff;
        width: 22px;
        height: 22px;
        line-height: 22px;
        font-size: 13px;
    }
    .nav-link.active .program-but-nump{
        background-color: #fff !important;
        color: #4A6CF7 !important;
        border: none !important;
    }
    
    .nightClass-title{
        font-size: 24px;
        line-height: 32px;
        word-break: keep-all;
    }
    .introduce-readingbox{
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .nightClass-title02{
        width: 100%;
        border-radius: 5px;
        margin-top: 20px;
        font-size: 16px;
        line-height: 24px;
        word-break: keep-all;
    }
    .nightClass-title03{
        line-height: 24px;
        word-break: keep-all;
    }
    .nightClass-intro{
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .bul-02ul li{
        font-size: 15px;
        line-height: 22px;
    }
    .program-chump{
        font-size: 16px;
        line-height: 25px;
        word-break: keep-all;
    }
    .program-chump-button{
        font-size: 16px;
        margin-top: 22px;
    }

    .chum-a{
        bottom: 7px !important;
    }
    .chum-a .chumimg{  
        width: 310px !important;
    }

    /* 구매하기 */
    .product-head{
        padding: 30px 15px;
    }    
    .product-head-p01{
        font-size: 24px;
        line-height: 32px;
    }
    .product-head-p02{
        font-size: 15px;
        margin-top: 20px;
        line-height: 23px;
        word-break: keep-all;
    }
    .product-content{
        margin: 20px 0;
    }
    .productContent{
        margin-top: 22px;
    }
    .productContent-flexbox{
        width: 100%;
        overflow-x: scroll;
    }
    .product-table{
        width: 1100px !important;
    }
    .product-warn p{
        font-size: 15px;
        word-break: keep-all;
    }
    .new-program-questionbut{
        font-size: 15px;
    }
    /* 마이 페이지 */
    .mypageContent-bottom-bg{
        padding: 30px 0;
        padding-top: 10px;
    }
    .mypageContent{
        padding: 15px;
    }
    .myvideotop{
        display: block !important;
    }
    .d-block{
        display: block !important;
    }
    .voca-video-box{
        margin-right: 0;
        margin-top: 20px;
    }
    .voca-video{
        width: 100%;
        margin-top: 7px;
    }
    .mypageContent-day{
        margin-top: 15px;
    }
    .voca-box{
        width: 100%;
    }
    .voca-bigbox{
        margin-top: 20px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .mypage-speaking-overbox{
        padding-left: 15px;
        overflow: auto;
        width: 100%;
        padding-bottom: 20px !important;
    }
    .mypage-speaking-scrollbox{
        width: 1500px;
        padding-bottom: 30px !important; 
    }
    .reading_basic-nav{
        height: auto;
    }
    .mt-5{
        margin-top: 20px !important;
    }
    .reading-basic-t01-scroll{
        width: 100%;
        overflow: auto;
    }
    .re-head-sc,
    .re-body-sc{
        width: 1000px;
    }
    .re-body-sc{
        height: 450px;
    }
    .reading-intermediate-div{
        width: 100%;
        margin-top: 20px;
    }
    .reading-intermediate-div:nth-child(1){
        margin-top: 0;
    }
    .rb-fil-span{
        margin-right: 0;
    }
    .rb-fil-span,
    .rb-cho-span{
        padding-left: 15px;
        padding-right: 15px;
    }
    .reading-intermediate-div-content{
        gap: 0;
        padding-left: 15px;
        padding-right: 15px;
    }
    .reading-intermediate-div table thead tr th{
        font-size: 14px;
    }
    /* 바텀메뉴 */
    .sidenav-mobile {
        height: 100%;
        width: 100%;
        position: fixed;
        z-index: 10;
        top: 0;
        left: -100%;
        background-color: #fff;
        overflow-x: hidden;
        transition: 0.2s;
        padding-top: 0px;
        text-align:center;
    }
}







/* -------------------- */
/* ------------------ */
@media(max-width:768px){
    .noflexco{
        display: block !important;
    }
    .arti-search{
        margin-left: 0;
    }
    .arti-search{
        width: 100%;
        margin-top: 20px;
    }
    
    .arti-speaking-box{
        width: 100%;
    }
    
    .reading-inter-contentbox{
        padding: 0 15px;
    }
    
    .order-table tr th,
    .order-table tr td {
        border: 1px solid #e0e0e0;
        padding: 15px 8px;
        text-align: center;
        vertical-align: middle;
        font-size: 13px;
    }

    .product-nav button{
        font-size: 14px;
        width: auto !important;
    }

    .correct-bg{
        padding-top: 25px;
        height: 102px;
        background-size: cover;
    }

    .result-pracbigbox{
        display: block;
        padding: 0 15px;
    }
    .calenderpage-flexbox-left{
        margin-right: 0;
    }
    .calenderpage-flexbox-right{
        width: 100%;
    }
    .examresult-page-calender-tbody .nonefinishbox{
        font-size: 11px;
        padding: 4px;
        line-height: 16px;
    }
}