/*나의강의실 탭*/
.status_tab{width:100%; overflow: hidden;}
.status_tab li:first-child a{border-left: 1px solid #ddd;}
.status_tab li a{text-align: center; padding: 12px 0; float: left; width: 14.285%; border-top: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 2px solid #2d4984; font-weight: 500; font-size: 15px;}
.status_tab .active{color:#fff; background: #2d4984; border: 1px solid #2d4984; border-bottom:2px solid #2d4984;}

.status_small_tab{width:100%; overflow:hidden; margin:15px 0;}
.status_small_tab li{float:left; border-right:1px solid #ddd; padding:0 15px;}
/*.status_small_tab li:first-child{padding-left:0;}*/
.status_small_tab li:last-child{border-right:0;}
.status_small_tab .active{color:#2f62cb; font-weight: 500;}

/*나의강의실 테이블*/
.status_table{width:100%;}
.status_table th{text-align: center; height:40px;}
.status_table td{text-align: center; height: 60px;}
/*20200417 추가 Start*/
.status_big_table.status_table td p{font-weight: bold; line-height: 22px; font-size:15px; text-align: left;}
/*20200417 추가 End*/
.status_table td small{font-size:12px; line-height: 12px;}
.status_table .text-left{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.status_table .text-left a{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
/* 20200416 쿠폰명 말줄임 적용 Start */
.status_table .text-left.text_ellipsis{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
/* 20200416 쿠폰명 말줄임 적용 End */
.status_table .common_btn:last-child{margin-top:5px; cursor: pointer;}

.status_big_table td{padding:10px; height:100px;}

.status_process{overflow: hidden; width: 100%; min-width:260px;}
.status_process > div{display: inline-block;}
.status_step{line-height: 90px; margin-left: 10px;}
.status_step span{font-weight: bold;}

/*진도율*/
svg.radial_progress {height: auto; max-width: 90px; transform: rotate(-90deg); width: 100%;}
svg.radial_progress circle {stroke-dashoffset: 219.91148575129; stroke-width: 10;}
svg.radial_progress circle.incomplete {opacity: 0.25; fill: rgba(0,0,0,0); stroke: #fff;}
svg.radial_progress circle.complete {stroke-dasharray: 219.91148575129; }
svg.radial_progress text{color: #222; text-anchor: middle; font-size:14px;}

/*기간검색*/
.date_search{width: 100%; background: #f4f5f7; border: 1px solid #ddd; padding:15px; margin-bottom:15px; margin-top:15px;}
.date_search > p{font-weight: bold; display: inline-block; margin-right:10px;}
.date_search ul{overflow:hidden; display: inline-block; vertical-align: middle; margin-right:20px;}
.date_search li{float:left;}
.date_search li a{border-top:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #ddd; background: #fff; height:33px; width:65px; text-align: center; line-height: 30px;}
.date_search li:first-child a{border-left:1px solid #ddd;}
.date_search li .active{border:1px solid #2f62cb; color:#2f62cb;}

.calendar_wrap{display: inline-block;}
.calendar_wrap input{background: #fff url("/front/images/mypage/calendar_icon.png") no-repeat 95% 50%; border: 1px solid #ddd; height: 33px; width:150px;}

.btn_wrap{width:100%; margin-top:15px;}

/*하단 추가 인포메이션*/
.information_box{width:100%; margin-top:30px; border:5px solid #ddd; padding:15px;}
.information_box span{font-weight: bold;}
.information_box a{text-decoration: underline; display: inline-block;}
.information_box a:hover{color:#2f62cb; transition-duration: .5s;}

/*쿠폰등록하기*/
.status_tab_wrap2 .status_small_tab{margin-top:0;}
.status_tab_wrap2 a{font-size:13px;}
.coupon_enrollment{margin:15px 0 0;}
.coupon_enrollment input{border: 1px solid #ddd; height: 33px; width:150px;}

/*사용종료된쿠폰*/
.coupon_end td{opacity: .7;}

/*마일리지*/
.mileage_wrap{width:100%; overflow: hidden; padding: 30px; border: 1px solid #ddd; background: #f4f5f7; text-align: center; margin:15px 0;}
.mileage_wrap > div{display: inline-block; margin-right:50px;}
.mileage_wrap > div:last-child{margin-right:0;}
.mileage_available{vertical-align: middle;}
.mileage_available p{display:block; text-align: left; font-size:15px;}
.mileage_available h3{font-size: 24px; line-height: 33px; text-align:left;}
.mileage_available h3 span{font-size: 33px; font-weight: 800;}
.mileage_txt h3, .mileage_txt p{color:#2d4984;}
.mileage_wrap > div.mileage_img{margin-right:10px;}
.mileage_icon{visibility: hidden;}

/*상담현황*/
.consulting_btn_wrap > div{display: inline-block;}
.consulting_btn_wrap > div.text-right{float:right;}
.consulting_btn_wrap select, .consulting_btn_wrap input{border: 1px solid #ddd; height: 33px;}
/* 20200320 input: width 300 에서 246으로 수정 Start */
.consulting_btn_wrap input{width:246px;}
/* 20200320 input: width 300 에서 246으로 수정 End */
.consulting_btn_wrap select{width:100px;}

/*1:1문의*/
.answer_condition{width:100%; overflow: hidden; padding: 15px 30px; border: 1px solid #ddd; background: #f4f5f7; text-align: center; margin:15px 0;}
.answer_condition div{display: inline-block;}
.answer_condition > div{float:left; width:50%; border-right:1px solid #ddd;}
.answer_condition > div:last-child{border-right: 0;}
.answer_condition .color_red span, .answer_condition .color_gray span{font-size:30px; font-weight: 700; margin-left:10px;}

/*문의 뷰*/
.view_table th, .view_table td{height:50px;}
.content_box td, .content_box th{height:200px; overflow: auto;}
.content_box td{vertical-align: text-top; padding:15px 10px;}
.download_file a{display:inline-block; width:100%!important; vertical-align: middle;}
.status_table .text-left{overflow: inherit; text-overflow: inherit; white-space: inherit;}
.download_file img{margin-right:5px;}

/*답변박스*/
.answer_title{line-height: 30px; font-size:20px; font-weight: 500;}
.answer_box th, .answer_box td{height:200px;}
.answer_box td{vertical-align: text-top; padding:15px 10px;}

/*쓰기*/
.content_box_write th, .content_box_write td{height:400px;}
.content_box textarea{width:100%; height: 100%; padding: 10px; border: 1px solid #ddd; overflow-y: scroll; overflow: auto;}
.view_table input{width:100%;}

/*교수님께문의*/
.professor_table select{width:100%;}

/*자주묻는질문*/
.faq_table{table-layout: fixed;}
.status_tab_wrap3{background:#f4f5f7; border:1px solid #ddd; padding:10px 0;}
.status_tab_wrap2 .status_small_tab{margin-bottom:0;}
.faq_title{cursor:pointer;}
.faq_answer{display: none; width:100%; position: relative;}
.accordion_content{display: none; overflow: hidden; width:100%; margin:10px 0;}
.accordion_content div{float:left; text-align: center;}
/* 20200416 text-align:center 추가 Start */
.accordion_content div:first-child{width:10%; text-align: center;}
/* 20200416 text-align:center 추가 End */
.accordion_content div:last-child{width: 90%; text-align: left; font-weight: 400; font-size: 14px;}
.faq_answer td{padding:0; height: 0;}

@media(max-width:991px){
    /*기간검색*/
    .date_search{overflow: hidden; width:100%;}
    .calendar_wrap{clear: both; margin-top:10px; float:right;}

    .status_tab li a{font-size:14px; padding:10px 0;}

    /*마일리지*/
    .mileage_wrap{padding: 10px;}
    .status_wrap .mileage_wrap > div{margin-right: 20px;}
    .mileage_available p{font-size:13px;}
    .mileage_available h3 span{font-size: 25px;}
}

@media(max-width:786px){
    /*나의강의실 탭구조*/
    .status_tab li a{width:25%;}
    .status_tab li a{border-bottom:1px solid #ddd;}
    .status_tab .active{border-bottom:1px solid #2d4984;}
    .status_tab li:first-child a.active{border-left:1px solid #2d4984;}
    .status_tab li:nth-child(n+5) a{border-top:0;}
    .status_tab li:nth-child(5) a{border-left:1px solid #ddd;}

    .select_lecture select{width:150px;}

    .coupon_enrollment{margin-bottom:15px;}

    /*마일리지*/
    .mileage_wrap .mileage_img{display: none;}

    /*1:1문의,교수님께문의 반응형하는 경우 resize_table 추가*/
    .resize_table{width:100%; table-layout: fixed;}
    .resize_table thead{display: none;}
    .resize_table tr{position: relative; overflow: hidden; display: block; width: 100%; float: left; height: auto;}
    .resize_table td{display: block; float: left; height:auto; width:100%; text-align: left; padding-left:20%; position: relative;}
    .resize_table td::before{position: absolute; width:20%; left:10px; color: #2f62cb; font-weight: 500;}
    .resize_table td:nth-child(1){display: none;}
    .resize_table td:nth-child(2)::before{content: '구분';}
    .resize_table td:nth-child(3)::before{content: '제목';}
    .resize_table td:nth-child(4)::before{content: '등록일';}
    .resize_table td:nth-child(5)::before{content: '답변일';}
    .resize_table td:nth-child(6)::before{content: '답변상태';}

    .resize_table td:nth-child(4){width:50%;}
    .resize_table td:nth-child(5){width:50%;}
}

@media(max-width:600px){
    .status_small_tab li{padding:0 5px;}
    .calendar_wrap{float:inherit; width:100%; text-align: center; margin-top: 5px;}
    .calendar_wrap input{width:48%; margin-bottom: 10px;}
    .calendar_wrap input:nth-of-type(1){float:left;}
    .calendar_wrap input:nth-of-type(2){float:right;}
    .calendar_wrap button{clear: both; display:block; width:100%;}
    .date_search li a{width: 60px; margin-top:10px;}
    .date_search > p{vertical-align: -webkit-baseline-middle;}

    .coupon_enrollment{margin-top:20px}
    .coupon_enrollment > div{text-align: center!important;}
    .coupon_enrollment input{width:48%; margin-bottom: 10px; vertical-align: top;}
    .coupon_enrollment input:nth-of-type(1){float:left;}
    .coupon_enrollment input:nth-of-type(2){float:right;}
    /* 20200413 쿠폰 번호 기입 input 넓이 100% 추가 Start */
    .coupon_enrollment .coupon_num{width:100%;}
    /* 20200413 쿠폰 번호 기입 input 넓이 100% 추가 End */
    .coupon_enrollment button{width:100%;}

    /*상담현황*/
    .consulting_btn_wrap .text-left{width:100%; overflow: hidden;}
    /* 20200320 검색 버튼 크기 설정: min-width 값 추가 Start */
    .consulting_btn_wrap .text-left button{width:20%; min-width: auto; float: right;}
    /* 20200320 검색 버튼 크기 설정: min-width 값 추가 End */
    .consulting_btn_wrap .text-left select{width:19%; margin-right: 1%;}
    .consulting_btn_wrap .text-left input{width:57%; margin-right: 1%;}
    .consulting_btn_wrap .text-right{width:100%; margin-top:20px;}
    .consulting_btn_wrap{}
    /* 20200320 button : min-height 값 추가 Start */
    .consulting_btn_wrap .text-right button{width:100%; min-height: 36px;}
    /* 20200320 button : min-height 값 추가 End */

    .view_table tr th{width:80px;}
}
@media(max-width:500px){
    .mileage_wrap{padding:20px;}
    .mileage_wrap > div > img{width:50%;}
    .status_wrap .mileage_wrap > div {margin-right: 0;}
}
@media(max-width:450px){
    .mileage_wrap{text-align: left;}
    .mileage_wrap > div:nth-child(2){width:100%; margin-bottom:10px;}
    /* 20200414 사용 마일리지 수정 Start */
    .mileage_wrap.use_mileage .mileage_icon{display: none;}
    .mileage_wrap.use_mileage .mileage_available:nth-child(5n){width: 50%;}
    /* 20200414 사용 마일리지 수정 End */
    /* 20200314 기간검색 마진값 수정 Start */
    .date_search ul{margin-right: 0;}
    /* 20200314 기간검색 마진값 수정 End */
}

@media(max-width:320px){
    .status_tab li a{font-size:13px; letter-spacing: -1px;}
    .status_small_tab li{font-size:13px;}
    .date_search li a{width:50px; font-size:13px;}
    .status_wrap .mileage_wrap > div {margin-right: 0; text-align: center;}
}


/*수강현황 - 수강중인강의 - 학습진도율 B안*/
.status_big_table .status_process_b{height:auto; padding:10px 10px 5px;}
.status_big_table .status_step{line-height:30px;}
/* 20200925 배경색 변경, 텍스트 그림자 Start */
.progress {height: 20px; width: 70%; border-radius: 0; background-color: #d1d6dc;}
.progress-bar {background: -webkit-linear-gradient(left, #7f57e3 0%,#5eaefd 100%); /* Chrome10-25,Safari5.1-6 */ height:20px; transition: unset; width:0; text-shadow: 0 0 10px #062552;}
/* 20200925 배경색 변경, border-radius 0 삭제, 텍스트 그림자 End */

/*수강현황 - 수강중인강의 - 남은수강일*/
.status_big_table td p{text-align: center;}

/*수강현황 - 장바구니 - 금액추가*/
.mypage_table span.cart_price {text-decoration: line-through; line-height: 25px; font-size: 13px; color: red;}
.mypage_table span.cart_sale {font-weight: 500;}

/*20200414 나의강의실 쿠폰 이미지 퍼블리싱 추가*/
/* 20200416 쿠폰 마집 오른쪽 값 추가 Start */
.coupon_img{width:47px; height:22px; display: inline-block; text-align: center; font-size:14px; font-weight:bold; color: #fff; padding-left: 2px; margin-right: 6px;}
/* 20200416 쿠폰 마집 오른쪽 값 추가 End */
.coupon_img_blue{background: url("/front/images/mypage/coupon_per_blue.png") no-repeat;}
.coupon_img_gray{background: url("/front/images/mypage/coupon_per_gray.png") no-repeat;}

/*20200422 쿠폰이미지에 css 추가*/
.coupon_img{margin-right:5px;}

/*20200909 나의강의실 - 결제/배송내역 - 교재주문배송내역 추가*/
.book_delivery_wrap td{min-height: 40px; padding: 15px 0;}
.delivery_ready{cursor: default; color: #888;}
.delivery_ing{color: #2f62cb;}
.delivery_complete{color: #cb2f2f;}
.delivery_review_btn{margin-top: 5px; height: 30px; line-height:28px; display: inline-block; background: #eaeef2; color: #2f62cb; border: 1px solid #2f62cb; width: 100px; text-align: center;}
.delivery_review_btn span{vertical-align: middle; line-height: 25px; font-size: 22px; margin-bottom: 4px;}

.book_review_popup h1{font-weight: bold; font-size: 19px;}
.book_review_popup hr{border-top: 2px solid #222;}
.book_review_contents{background: #f7f7f7; padding: 20px;}
.book_review_contents p{font-size: 18px; font-weight: bold; color: #33338a;}
.book_review_contents span{color: #666; font-size: 14px; font-weight: 400;}
.review_box_text{position: relative;}
.review_box_text textarea{width: 100%; resize: none; padding: 10px; height: 200px; overflow-y: scroll; overflow: auto;}
.review_box_text span{position: absolute; bottom: 15px; right: 25px; color: #666; font-size: 13px;}
.book_review_popup h2{font-size: 18px; text-align: center; margin: 15px 0;}
.book_review_popup h3{font-size: 14px; color: #666; text-align: center; margin:15px 0; font-weight: 400;}

.star_box{text-align: center;}
.star_icon{background: url('/front/images/sub/national/book/ico_review.png') no-repeat right 0; background-size: auto 100%; width: 30px; height: 30px; display: inline-block; text-indent: -9999px; cursor: pointer;}
.star_icon.on{background-position:0 0;}
.star_text_on{color: #fa8700;}
@media (max-width:1200px) {
    .book_review_contents span{display: block;}
    .book_delivery_wrap td.delivery_wrap{min-width:200px;}
}

/* 20200925 나의강의실 - 마일리지 추가 Start */
.status_wrap .save_mileage .mileage_available,.status_wrap .use_mileage .mileage_available{padding: 0; border-right: 0;}
/* 20200925 추가 End */

/* 20201006 모바일 사이즈 시, 테이블 수정 Start */
@media (max-width: 380px) {
    .view_table tr th{width: 66px;}
    .view_table td{word-break: break-word;}
    .status_table th, .status_table td{padding: 5px 8px;}
}
/* 20201006 모바일 사이즈 시, 테이블 수정 End */

/* 20201007 리스트 페이지 하단 검색영역 수정 Start */
@media (max-width: 470px) {
    .consulting_btn_wrap input{width: 40%;}
}
@media (max-width: 360px) {
    .consulting_btn_wrap > div{width: 100%;}
    .consulting_btn_wrap select{width: 30%;}
    .consulting_btn_wrap .search_btn{width: 28%;}
}
/* 20201007 리스트 페이지 하단 검색영역 수정 End */

/*부트스트랩 모달 가운데 띄우기*/
/*.modal {text-align: center;}*/
/*@media screen and (min-width: 768px) {*/
/*    .modal:before {display: inline-block; vertical-align: middle; content: " "; height: 100%;}*/
/*}*/
/*.modal-dialog {display: inline-block; text-align: left; vertical-align: middle;}*/

/*210623 나의강의실 - 학습방 - 강의설문 추가*/
.survey_table .common_btn.disabled{cursor: inherit; opacity: .5;}