@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");
* {
    font-family: "Noto Sans KR", sans-serif !important;
    box-sizing: border-box;
    letter-spacing: -0.5px;
}


html,body{
    height: 100%;
}

.loginbg{
    width: 100%;
    height: 100%;
    position: relative;
    background: url("/images/logbg.png");
    background-size: cover;
    background-repeat: no-repeat;
}

body{
    background-color: #333DD6;
}

.w1600{
    max-width: 1600px;
    margin: 0 auto;
}

.conformbut{
    width: 200px;
    background-color: #11864f !important;
    border: none !important;
}

.conformbut02{
    background-color: #363636 !important;
    border: none !important;
}
.conformbut03{
    width: 100%;
}

.header{
    width: 100%;
    height: 64px;
    background-color: #fff;
}

.logo{
    font-size: 32px;
    font-weight: 500;
}

.headerbox{
    height: 64px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logoutbut{
    font-size: 18px;
    background-color: #3D3D3D;
    color: #fff;
    height: 42px;
    padding: 0 15px;
    border-radius: 6px;
    transition: 0.2s;
}

.logoutbut:hover{
    background-color: #1f1f1f;
}

.alertbox{
    text-align: center;
}
.alertbox-p{
    font-size: 18px;
    line-height: 24px;
    margin-top: 10px;
}

.twobutton{
    display: flex;
}

.mybox{
    font-size: 18px;
    background-color: #FF6F1E;
    color: #fff;
    height: 42px;
    line-height: 42px;
    padding: 0 15px;
    border-radius: 6px;
    margin-right: 5px;
}

.morebut{
    background-color: #333DD6;
    border-radius: 50px;
    color: #fff;
    width: 128px;
    height: 36px;
}

.contentbox{
    padding-top: 20px;
    padding-bottom: 100px;
}

.w100{
    width: 100% !important;
}
.w50{
    width: 50%;
}

.w90px{
    width: 90px;
}

.w240px{
    width: 240px;
}

.mr10{
    margin-right: 8px;
}
.mr70{
    margin-right: 70px;
}

.mt70{
    margin-top: 70px;
}
.mr20{
    margin-right: 20px;
}

.re-border{
    border: 1px solid #d4d4d4;
    padding: 30px;
    position: relative;
}

.readinput{
    border-radius: 4px;
    background-color: #f3f3f3;
    color: #6D6D6D;
    border: 1px solid #DDDDDD;
}

.w-auto{
    width: auto !important;
}

.vertical-middle{
    vertical-align: middle;
}

h2{
    font-size: 30px !important;
    color: #fff;
}

.mt35{
    margin-top: 40px;
}

table{
    width: 100%;
}

.title-h2{
    position: relative;
    margin-left: 36px;
}
.title-h4{
    margin-left: 36px;
    color: #fff;
    font-weight: 300;
    margin-top: 7px;
}

.title-h2::after{
    content: "";
    display: block;
    position: absolute;
    left: -37px;
    bottom: -2px;
    width: 29px;
    height: 34px;
    background: url("/images/Polygon.png");
    background-size: contain;
    background-repeat: no-repeat;
}

.ul-num-p{
    width: 30px;
    height: 30px;
    line-height: 29px;
    border-radius: 50px;
    background-color: #333DD6;
    color: #fff;
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    margin-right: 5px;
}

.txt-center{
    text-align: center;
}

.ssm-p{
    font-size: 13px;
}
.sm-p{
    font-size: 16px;
}

.re-p{
    font-size: 20px;
    line-height: 28px;
}

.mi-p{
    font-size: 26px;
    line-height: 35px;
    font-weight: 500;
}

.redspan{
    color: #FF2121;
}
.bluespan{
    font-weight: 500;
    color: #333DD6;
}
.yellowspan{
    color: #fff352;
}
.color-fff{
    color: #fff;
}

.whitebox{
    width: 100%;
    padding: 40px;
    margin-top: 20px;
    background-color: #fff;
    box-shadow: 5px 5px 16px rgba(8, 10, 36, 0.5);
    border-radius: 30px;
}

.understandbuttonbox{
    display: flex;
    justify-content: center;
    margin-top: 50px;
}

.understandbuttonbox button.program-nextbut{
    position: relative;
    display: flex;
    align-items: center;
    height: 60px;
    border-radius: 50px;
    font-size: 24px;
    font-weight: 500;
    padding: 0 30px;
    padding-right: 72px;
}
.program-prevbut{
    position: relative;
    display: flex;
    align-items: center;
    height: 60px;
    border-radius: 50px;
    font-size: 24px;
    font-weight: 500;
    padding: 0 30px;
    padding-left: 80px !important;
    padding-right: 30px !important;
    margin-right: 20px;
}

.understand-nextarrow{
    position: absolute;
    top: 7px;
    right: 7px;
}
.understand-prevarrow{
    position: absolute;
    top: 7px;
    left: 7px;
}

.program-nextbut,
.program-prevbut{
    background-color: #fff;
    color: #333DD6;
}

.choice-butbox button{
    margin-right: 10px;
}
.choice-butbox button:last-child{
    margin-right: 0;
}

.choice-but{
    color: #fff;
    font-size: 30px;
    line-height: 38px;
    font-weight: 500;
    border-radius: 10px;
    padding: 20px 0px;
}

.choice-but-blue{
    background: linear-gradient(106.97deg, #8567FF 27.87%, #333DD6 91.91%);
}
.choice-but-orange{
    background: linear-gradient(106.97deg, #FFBB0E 27.87%, #FF7A00 91.91%);
}
.choice-but-red{
    background: linear-gradient(106.97deg, #FF6767 27.87%, #D63364 91.91%);
}
.choice-but-green{
    background: linear-gradient(106.97deg, #22D03E 27.87%, #1CA372 91.91%);
}

.sign-input{
    border: none;
    width: 100%;
    border-bottom: 1px solid #E1E1E1;
    padding-bottom: 6px;
    font-size: 22px;
}
.sign-input::placeholder{
    color: #B1B1B1;
}

/* 로그인 */
.cloud{
    width: 90px;
}
.log-title{
    text-align: center;
    font-size: 26px;
    font-weight: 500;
    color: #fff;
}
.logbox {
    width: 390px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.loginbox-content .login-input {
    width: 100%;
    height: 50px;
    padding-left: 20px;
    border-radius: 6px;
    border: 1px solid #dee2e6;
}

.loginbox-content .login-input:focus {
    outline: 1px solid #78b2ff;
}

.loginbox-content .loginbutton {
    width: 100%;
    height: 50px;
    border-radius: 6px;
    background-color: #FF6F1E ;
    color: #fff;
    font-size: 15px;
    margin-top: 8px;
    transition: background 0.2s linear;
}

.loginbox-content .loginbutton:hover {
    background-color: #ff5e1e ;
}

.loginbox-content .signbutton {
    width: 100%;
    height: 50px;
    border-radius: 6px;
    background-color: #1E1E1E;
    color: #fff;
    font-size: 15px;
    margin-top: 8px;
}

/* 회원가입 */
.sign-mt{
    margin-top: 100px;
    margin-bottom: 80px;
}
.signupbox label {
    display: flex;
    align-items: center;
    font-size: 1rem;
}
.signupbox label input[type="checkbox"] {
    margin: 0;
    margin-right: 7px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    outline: none;
    appearance: none;
    background-image: url("/images/nocheck.png");
}

.signupbox label input[type="checkbox"]:checked {
    margin: 0;
    margin-right: 7px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    outline: none;
    appearance: none;
    background-image: url("/images/check.png");
}

.signupbox-p{
    text-align: center;
    font-size: 28px;
    font-weight: 500;
}
.signupbox-content{
    width: 520px;
    background-color: #fff;
    border-radius: 10px;
    margin: 0 auto;
    padding: 40px;
}

.gi-ml{
    margin-left: 5px;
}
.se-but{
    cursor: pointer;
}

.reservation-modal-body select,
.signupbox-content select{
    border: none;
    border-bottom: 1px solid #dee2e6;
    font-size: 16px;
    font-weight: 400;
    color: #2c2c2c;
    font-family: 'Noto Sans KR', sans-serif !important;
    padding: 8px;
    margin-top: 13px;
}

.seradio{opacity: 0;}
.seradiobox label{
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    width: 100%;
    font-size: 14px;
    padding: 16px 0;
    text-align: center;
    justify-content: center;
}
.seradiobox input[type="radio"]:checked+label{
    background-color: #333DD6;
    border: none;
    color: #fff;
}
.mypage-input{
    width: 100%;
    border: none;
    border-bottom: 1px solid #dee2e6;
    margin-top: 20px;
    padding-left: 10px;
    padding-bottom: 10px;
    border-radius: 0 !important;
}

.mypage-input::placeholder{
    font-size: 16px;
    font-weight: 300;
    color: #B5B5B5;
    font-family: 'Noto Sans KR', sans-serif !important;
}

.agreebox{
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-top: 20px;
}

.agreebox-all{
    background-color: #f7f7f7;
    padding: 14px 20px;
}

.agreespan{
    color: #303030;
}

.morespan{
    font-size: 14px;
    text-decoration: underline;
    color: #bcbcbc;
}

.signinbut{
    width: 185px;
    height: 52px;
    border-radius: 4px;
    background-color: #333DD6;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
    font-size: 16px;
    font-weight: 500;
}

.signup-input-alert{
    font-size: 12px;
    line-height: 18px;
    color: #DE1A32;
    margin-top: 5px;
}

.signup-certifybutbox{
    display: flex;
    align-items: center;
}

.signup-certifybutbox button{
    height: 40px;
    background-color: #dee2e6;
    padding: 0 15px;
    border-radius: 4px;
    color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
}

.signup-certifybutbox button:nth-child(1){
    background-color: #353535;
    margin-right: 3px;
}
.signup-certifybutbox button:nth-child(2){
    background-color: #6d6d6d;
    margin-right: 3px;
}

.signup-modal section.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
}
.signup-modal section.modalWindow {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 999 !important;
    width: 600px;
    background: #FFF;
    border-radius: 6px;
}
.signup-modal section.modal.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 997;
    cursor: pointer;
}

.signup-modal .closeBtn {
    position: absolute;
    right: 20px;
    top: 13px;
    cursor: pointer;
}

.signup-modal .modalWrapperbody p{
    font-family: 'Noto Sans KR', sans-serif !important;
}

.signup-modalButton{
    cursor: pointer;
}

.online_wrbut{
    width: 200px;
}

/* 라이도 커스텀 */
.radiocustom-flexbox{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}



.radiocustom input[type="radio"] ,
.radiocustom input[type="checkbox"] {
    display: none;
}

.radiocustom input[type="radio"] + label,
.radiocustom input[type="checkbox"] + label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    height: 44px;
    border: 1px solid #CECECE;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    border-radius: 8px;
    padding-left: 50px;
    padding-right: 20px;
}

.radiocustom input[type="radio"] + label::before,
.radiocustom input[type="checkbox"] + label::before{
    content: "";
    position: absolute;
    display: block;
    left: 14px;
    bottom: 8px;
    width: 25px;
    height: 25px;
    background: url("/images/custom-nocheck.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.radiocustom input[type="radio"]:checked + label,
.radiocustom input[type="checkbox"]:checked + label {
    position: relative;
    background-color: #333DD6;
    color: #fff;
}

.radiocustom input[type="radio"]:checked + label::before,
.radiocustom input[type="checkbox"]:checked + label::before {
    content: "";
    position: absolute;
    display: block;
    left: 14px;
    bottom: 8px;
    width: 25px;
    height: 25px;
    background: url("/images/custom-check.png");
    background-size: cover;
    background-repeat: no-repeat;
}


.blackname{
    padding: 10px 15px;
    background-color: #2e2e2e;
    color: #fff;
    border-radius: 4px;
}

.redname{
    position: relative;
    padding: 10px 15px;
    background-color: #FF2323;
    color: #fff;
    border-radius: 4px;
}
.redname:after{
    content: "*필수";
    display: block;
    position: absolute;
    top: -15px;
    left: 0px;
    font-size: 13px;
    color: #FF2121;
}

.junior-after{
    position: relative;
}
.junior-after:after{
    content: "*주니어 필수";
    display: block;
    position: absolute;
    top: -15px;
    left: 0px;
    font-size: 13px;
    color: #FF2121;
}
/* 푸터 */
.footer{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 45px;
    line-height: 45px;
    background-color: #FF6F1E;
    text-align: center;
    color: #fff
}

/* 스와이퍼 메뉴 */
.progress-sticky{
    position: sticky;
    top: 0;
    padding: 20px 0;
    background-color: #333DD6;
    z-index: 10;
}
.swiper{
    position: unset !important;
}
.swiper-menubox{
    max-width: 1600px;
    margin: 0 auto;
}
/* 프로그램 오티 메뉴 */
.swiper-button-prev:after,
.swiper-button-next:after{
    color: #fff !important;
}
.program-menu-slidebox .swiper-slide,
.life-menu-slidebox .swiper-slide{
    height: 100px;
    background-color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 20px 0;
    cursor: pointer;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.life-menu-slidebox .swiper-slide{
    background-color: #fff !important;
    color: #131415 !important;
}

.swiper-slide span{
    color: #333DD6;
}

.swiper-button-disabled{
    /* opacity: 1 !important; */
}

.swiper-button-prev{
    top: 72px !important;
    left: 92px !important;
}
.swiper-button-next{
    top: 72px !important;
    right: 92px !important;
}

.swiper-slide.now{
    background-color: #FF6F1E !important;
    color: #fff !important;
}
.swiper-slide.now span{
    color: #FCFF71 !important;
}
/* 프로그래스바 */
.stickybar{
    position: fixed;
    top: 64px;
    margin-top: 0 !important;
    width: 100%;
    background-color: #131415;
    /* padding: 0 !important; */
    padding: 20px 140px 30px !important;
    z-index: 999;
}
.stickybar02{
    position: fixed;
    top: 64px;
    margin-top: 0 !important;
    width: 100%;
    background-color: #FFE353;
    /* padding: 0 !important; */
    padding: 20px 140px 30px !important;
    z-index: 999;
}
.life-profressbox{
    margin: 0 auto;
    max-width: 1600px;
    margin-top: 20px;
}
.program-profressbox .progress,
.life-profressbox .progress{
    background-color: #fff !important;
    border-radius: 50px !important;
}
.life-profressbox .progress{
    background-color: #E4EAFF !important;
}
.life-profressbox .progressNum{
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 3px;
}
.life-profressbox .progressNum{
    color: #ffffff;
    margin-bottom: 10px;
}

.life-profressbox .progressNum span{
    color: #ffe91e;
}

.life-profressbox .progress-bar{
    background: linear-gradient(101.36deg, #FFDB59 12.61%, #FF391E 153.24%);
    border-radius: 50px !important;
}


/* 온라인 상담 및 참강 수업시 주의사항 */
.forbidden-phone{
    position: relative;
}

.forbidden-phone:after{
    content: "";
    display: block;
    position: absolute;
    right: -95px;
    top: -53px;
    width: 76px;
    height: 132px;
    background: url("/images/forbidden-phone.png");
    background-size: contain;
    background-repeat: no-repeat;
}

.prev-exam-img01{
    width: 800px;
}


/* 시험전 확인사항(과목 선택) */
.prev-exam02 .choice-but{
    width: 260px !important; 
}

/* 시험전 확인사항(성인/주니어 선택) */
.adult-img{
    height: 44px;
    margin-right: 8px;
}

.junior-img{
    height: 44px;
    margin-right: 8px;
}
.prev-exam03 .choice-but{
    width: 350px !important; 
}


/* 시험전 확인사항(브로셔) */
.prev-exam04 .whitebox{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.sub-menu{
    display: none;
}
.sub-btn-little-title{
    color: #1d1d1d !important;
    font-weight: 500 !important;
    margin-top: 20px;
}
.sub-item{
    display: block;
    width: 100%;
    text-align: left;
    height: 40px !important;
    font-size: 20px !important;
    line-height: 40px !important;
    font-weight: 500 !important;
    margin-top: 0 !important;
}
.dongdown{
    position: absolute;
    right: 0px;
    transition: 0.3s ease;
}
.rotate{
    transform: rotate(90deg);
}

.sidenav {
    height: 100%; /* 100% Full-height */
    width: 226px; /* 0 width - change this with JavaScript */
    z-index: 1; /* Stay on top */
    background-color: #fff; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.3s; /* 0.5 second transition effect to slide in the sidenav */
    border-right: 10px solid #efefef;
    padding: 40px 0;
}

.sidenav::-webkit-scrollbar {
    display: none;
}

.sidenav .form-check .form-check-input{
    float: right;
}
.sidenav .form-check{
    padding-left: 0;
}

.mainmenu{
    padding: 20px 20px 20px 15px;
    border-bottom: 1px solid #e0e0e0;
}

.mainmenu a.sub-btn{
    position: relative;
    font-weight: 600;
    color: #212121;
    display: flex;
    align-items: center;
    width: 100%;
    line-height: 21px;
}

.mainmenu a.sub-btn:hover{
    cursor: pointer;
}

.sub-btn-co2{
    color: #333DD6 !important;
}

.mainmenu .form-check label{
    color: #6C6C6C;
    font-size: 15px;
}

.mainmenu .form-check-input{
    border: none;
    background-color: #EDEDED;
}

.mainmenu .form-check-input:checked{
    background-color: #333DD6;
}

.mainmenu .sub-menu{
    margin-top: 15px;
}

.sidenav .form-check{
    margin-bottom: 3px;
}

.mainmenu .sub-menu .form-check:last-child{
    margin-bottom: 0;
}

.sidenav .scroll-bar-css::-webkit-scrollbar-track {
    background-color: #ECF0FF !important;
    border-radius: 10px;
}

.leftside-checknum{
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 21px;
    font-size: 14px;
    color: #fff;
    font-weight: 400;
    text-align: center;
    border-radius: 50px;
    background-color: #333DD6;
    margin-left: 10px;
}

.prev-exam04 .form-check-label{
    width: 90%;
}

.prev-exam04 .form-check-label:hover{
    color: #333DD6;
    cursor: pointer;
}

.prev-exam04-left{
    width: 226px;
}
.prev-exam04-right{
    flex: 1;
    padding-left: 30px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.prev-exam04-right .input-group{
    width: auto;
    margin-right: 20px;
}

.prev-exam04-right .input-group .input-group-text{
    background-color: #2e2e2e;
    color: #fff;
}

.orangetable thead tr{
    background-color: #FF6F1E;
}

.orangetable thead tr th{
    padding: 15px 10px;
    color: #fff;
    font-weight: 400;
    text-align: center;
}

.orangetable tbody tr td{
    padding: 10px 10px;
    color: #242424;
    font-weight: 400;
    text-align: center;
}

.orangetable tbody tr:nth-child(even){
    background-color: #F6F6F6;
}


/* 시험전 확인사항(반 선택) */
.prev-exam05 .choice-but-blue,
.prev-exam05 .choice-but-red{
    padding-left: 50px;
    padding-right: 50px;
}

.prev-exam05 .choice-but-orange span{
    font-size: 18px;
    font-weight: 400;
}

.prev-exam05 .choice-but-orange{
    padding-left: 50px;
    padding-right: 50px;
}

/* 시험전 확인사항(참강/현강 선택) */
.prev-exam06 .choice-but-blue,
.prev-exam06 .choice-but-orange{
    padding-left: 50px;
    padding-right: 50px;
}

/* 시험전 확인사항(개인 정보) */
.prev-exam07-signbox{
    width: 550px;
    margin: 0 auto;
    border-radius: 20px;
    padding: 50px 40px;
    border: 1px solid #C5C5C5;
}

.select-radio .form-check{
    width: 100%;
    padding-left: 0 !important;
    margin-right: 10px;
}
.select-radio .form-check:last-child{
    margin-right: 0;
}

.select-radio input[type=radio]{
    display: none;
}

.select-radio input[type=radio]+label{
    display: inline-block;
    cursor: pointer;
    height: 44px;
    width: 100%;
    background-color: #ECECEC;
    line-height: 42px;
    text-align: center;
    font-weight:500;
    font-size: 16px;
    border-radius: 6px;
}

.select-radio input[type=radio]:checked+label{
    background-color: #333DD6 !important;
    color: #fff;
}

.prev-exam07-signbox .form-select{
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #C5C5C5;
    padding-bottom: 6px;
    font-size: 22px;
    margin-right: 8px;
}
.prev-exam07-signbox .form-select:last-child{
    margin-right: 0;
}

.prev-exam07-signbox .form-select:focus{
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* 개인정보(개인정보) */
.white-borderbox{
    width: 100%;
    height: auto;
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #C5C5C5;
}

.prev-exam07 .btn-outline-secondary,
.prev-exam08 .btn-outline-secondary{
    background-color: #323232;
    border: none;
}

.graytable{
    border: 1px solid #DDDDDD;
}
.graytable td{
    vertical-align: middle;
}

.graytable thead tr{
    background-color: #F3F3F3;
}

.graytable thead tr th{
    padding: 15px 10px;
    color: #393939;
    font-weight: 500;
    text-align: center;
}

.graytable tbody tr td{
    padding: 10px 10px;
    color: #242424;
    font-weight: 400;
    text-align: center;
}

/* 개인정보(목적) */
.prev-exam07 .w230,
.prev-exam09 .w230{
    width: 230px;
}

.textareabox{
    width: 100%;
    border: 1px solid #C5C5C5;
    border-radius: 4px;
    padding: 10px;
}

/* 시험 후 반 배치 - 재시험 여부 */
.lateclock{
    width: 260px;
}
.prev-exam12 .choice-but{
    width: 260px !important;
}

/* 시험 후 반 배치 - 재시험 여부 */
.prev-exam13 .choice-but{
    width: 260px !important;
}

.warncard{
    width: 1000px;
    margin: 0 auto;
}

.warn-icon{
    width: 54px;
}

.warncard-iconbox{
    background-color: #F65555;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 15px 0;
    text-align: center;
}

.warncard-textbox{
    border: 1px solid #d9d9d9;
    border-top: none;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding: 20px 30px;
}

/* 시험 후 반 배치 - 집중여부 */
.student-exam{
    width: 360px;
}
.prev-exam14 .choice-but{
    width: 260px !important;
}

/* 시험 후 반 배치 - 보유한 어학점수 확인 */
.total-span{
    background-color: #333DD6;
    color: #fff;
}
.black15-span{
    background-color: #2e2e2e;
    color: #fff;
}

.prev-exam15 .total-inputbox .re-p{
    width: 200px;
    text-align: right;
}

.prev15-flex{
    flex: 1;
}

/* 반 배치 */
.prev16-card{
    width: 420px;
    max-width: 420px;
}

.prev16-card-title{
    font-size: 20px;
    color: #fff;
    padding: 15px 0;
    text-align: center;
    background-color: #131415;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.prev16-card-class{
    font-size: 48px;
    font-weight: 600;
}

.prev16-card-ul{
    text-align: center;
}

.prev16-card-ul li{
    font-size: 24px;
    margin-top: 20px;
}
.prev16-card-ul li:nth-child(1){
    margin-top: 0;
}

.re-but{
    width: 100%;
    font-size: 20px;
    padding: 15px 0;
    border-radius: 6px;
    color: #fff;
    background-color: #2E2E2E;
    transition: 0.2s;
}

.re-but:hover{
    background-color: #1a1a1a;
}

.orangebg{
    background-color: #FF6F1E !important;
}
.graybg{
    background-color: #535A6B !important;
}

.prev16-border{
    padding: 30px;
    text-align: center;
    border: 1px solid #D2D2D2;
    border-top: none;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.prev16-no{
    font-size: 34px;
    font-weight: 500;
    color: #7A7A7A;
}

/* 반 배치 - 동의여부 */
.exam-explain-img{
    width: 100%;
    border: 1px solid #d4d4d4;
}

.prev-exam17 .choice-but{
    padding-left: 40px;
    padding-right: 40px;
}

/* 반 배치 - 확정// */
.prev-exam18 .choice-but,
.prev-exam19 .choice-but,
.prev-exam20 .choice-but,
.prev-exam21 .choice-but{
    padding-left: 40px;
    padding-right: 40px;
}
.exam-explain-graph{
    width: 800px;
    border: 1px solid #d4d4d4;
}

.warn-img-box{
    position: relative;
}

.warn-people{
    position: absolute;
    bottom: -37px;
    left: 29px;
}

.warn-people img{
    width: 240px;
}

/* 수기 */
.life12-p{
    font-size: 20px;
    line-height: 28px;
    font-weight: 500;
}

.whats-blackselect{
    width: 80px;
    background-color: #0A0A0A !important;
    color: #fff;
    height: 34px;
    font-size: 15px;
    border: 1px solid #575757 !important;
    background-size:13px 8px;
    background-image: url("/images/whats-balckselect-arrow.png");
}

.life12but{
    display: flex;
    align-items: center;
    color: #fff;
    background: rgb(68,113,201);
    background: linear-gradient(138deg, rgba(68,113,201,1) 0%, rgba(26,10,92,1) 100%);
    border-radius: 4px;
    padding: 10px 15px;
    margin-top: 8px;
}

.prev21-a:hover{
    text-decoration: underline;
}

.prev21-gray{
    background-color: #EEEEEE;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    padding: 30px 0;
}

/* 등록확인 */
.prev-exam22 .choice-but{
    width: 260px !important; 
}

/* 록확인 - 당일 등록 여부 */
.prev-exam23 .choice-but,
.prev-exam24 .choice-but{
    padding-left: 40px;
    padding-right: 40px;
}

/* 등록확인 - 다음에 등록 */
.prev-exam26 .choice-but{
    padding-left: 60px;
    padding-right: 60px;
}
.calender-span{
    background-color: #363636;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    display: inline-block;
    height: 38px;
    width: 52px;
    text-align: center;
    line-height: 46px;
}

.calender-icon{
    width: 24px;
}

.calender-input{
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}


/* 강신청 및 결제 하러 가기 */
.prev-exam25 .choice-but{
    padding-left: 40px;
    padding-right: 40px;
}

/* 등록확인 - 다음에 등록 */
.prev-exam27 .choice-but{
    padding-left: 60px;
    padding-right: 60px;
}

/* 등록확인 - 등록하지 않을 시 */
.reason-box{
    width: 790px;
    margin: 0 auto;
}

.reason-box .radiocustom{
    width: calc(100%/4);
}

.reason-box  label{
    width: 100%;
}

.prev-exam28 .choice-but{
    width: 260px !important;
}

/* 결제 완료 */
.exam29-bookbox{
    width: 140px;
    margin-right: 20px;
}
.exam29-bookbox:last-child{
    margin-right: 0;
}
.exam29-book-img{
    border: 1px solid #dee2e6;
    width: 100%;
}
.exam29-bookname{
    border: 1px solid #1CA372;
    padding: 10px;
    margin-top: 8px;
}
.exam29-bookname p{
    text-align: center;
}
.ex29-a{
    color: #256aff;
}
.ex29-a:hover{
    text-decoration: underline;
}


.prev29-kakao{
    width: 200px;
}
/* 학원생활 및 프로그램 OT 보기 */
.prev-exam30 .choice-but{
    font-size: 26px !important;
    line-height: 30px;
    padding-left: 30px;
    padding-right: 30px;
}
.prev-exam30 .time-span{
    font-size: 20px;
    font-weight: 400;
}

.findschool-table{
    width: 100%;
    table-layout: fixed;
    margin-top: 20px;
    border: 1px solid #dfdfdf;
}

.findschool-table thead tr{
    background-color: #f4f4f4;
}

.findschool-table thead tr th{
    text-align: center;
    padding: 10px 0;
}

.findschool-table tbody tr td{
    text-align: center;
    padding: 10px 0;
}

.sugiboard-table{
    width: 100%;
    table-layout: fixed;
    margin-top: 20px;
    border: 1px solid #dfdfdf;
}

.sugiboard-table tbody tr{
    border-bottom: 1px solid #dfdfdf;
}

.sugiboard-table thead tr{
    background-color: #f4f4f4;
}

.sugiboard-table thead tr th{
    text-align: center;
    padding: 15px 0;
    font-weight: 500;
}

.sugiboard-table tbody tr td{
    text-align: center;
    padding: 15px 0;
}

.sugiboard-table tbody tr td.left{
    text-align: left !important;
}

.sugiboard-table tbody tr td a:hover{
    color: #333DD6;
}

.nav-num ul li a {
    display: block;
    width: 40px;
    height: 40px;
    font-size: 16px;
    border-radius: 50px;
    font-weight: 500;
    margin: 0 10px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: auto 1.6rem;
    border-radius: 50%;
    box-sizing: border-box;
    text-align: center;
    line-height: 36px;
}


.nav-num-active {
    background-color: #4A6CF7;
    color: #fff;
}

.batch-list-box{
    width: 100%;
}

.batch-list-box-date{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

.batch-list-box-date p{
    font-size: 20px;
}

.batch-list-box-date button{
    background-color: #333DD6;
    color: #fff;
    border-radius: 4px;
    padding: 10px 16px;
}

.batch-list-box-title{
    border-top: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
    background-color: #f4f4f4;
    padding: 15px;
}

.batch-list-box-title p{
    font-size: 20px;
    font-weight: 500;
}

.batch-list-box-content{
    padding: 20px 15px;
}

.batch-list-box-content-p{
    font-size: 18px;
    line-height: 26px;
}

@keyframes fade-in-out {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}