/* ==========================================================================
   newReview.css
   후기 리뉴얼 전용 스타일
   ========================================================================== */
  
.cursor{cursor:pointer;}
.review-title{display:flex; flex-direction:column; align-items:center; gap:15px; line-height:1; margin-bottom:50px;}
.review-title .sub-tit{font-size:20px; color:#818181}
.review-title .tit{font-size:36px; font-weight:bold;}

/* ==========================================================================
   후기 리스트 영역 — newCreditCourseDetail.css 에서 이관 (블록 자기완결)
   카드(.review-item) / 댓글(.reply*) / 정렬(.review-sort) / 통계(.review-box)
   ※ .review-detail / .review-sort-wrap 등 override 보다 위(앞)에 둬 cascade 순서 보존
   ========================================================================== */

/* 별 아이콘 base — 목록/마이페이지는 newCreditCourseDetail.css 미로드이므로 동봉
   (연수상세 가격영역서도 쓰여 원본은 newCreditCourseDetail.css 에 유지) */
.star-cnt{display:flex; gap:2px;}
.star-cnt .star{width:15px; height:15px; background:url('../images/icon/26_star.svg') no-repeat 0 0; background-size:contain}
.star-cnt .star.on{background-image:url('../images/icon/26_star_on.svg');}
.star-cnt .star.half{background-image:url('../images/icon/26_star_half.svg');}

/* 정렬바 + 카드 */
.review-sort{display:flex; align-items:center; justify-content:space-between; gap:30px; margin-bottom:20px; flex-wrap:wrap;}
.review-sort .btn-cnt{display:flex; gap:10px; justify-content:right;}
.review-sort .sorting{display:flex; gap:40px;}
.review-sort .sorting button{font-size:16px; color:#aaa; font-weight:500;}
.review-sort .sorting button.active{color:#000; font-weight:bold;}
.review-num{font-size:15px; color:#000; font-weight:bold; width:100%;}

.review-item .box{border-bottom:1px solid #ddd;}
.review-item .box.active{border-bottom:none;}
.review-item .box + .box{margin-top:60px;}
.review-item .item{padding:0 0 20px 90px; display:grid; grid-template-columns:200px auto; gap:20px;}
.review-item .info-item{display:flex; flex-direction:column; position:relative;}
.review-item .name{color:#000; font-weight:500; font-size:14px;}
.review-item .star-cnt{margin:10px 0 20px}
.review-item .day{font-size:13px; color:#aaa}
.review-item .text-item{display:flex; flex-direction:column; gap:20px;}
.review-item .tit{font-size:18px; font-weight:bold; color:#000;}
.review-item .tit[data-target], .review-item .txt[data-target]{cursor:pointer;}
.review-item .txt{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; white-space:pre-line;}
.review-item .btn-item{display:flex; align-items:center; justify-content:right; gap:10px; grid-column:1 / 3;}
.review-item .btn-item button{display:flex; gap:5px; align-items:center;}
.review-item .btn-item strong{color:#4272f9}
.review-item .btn-item button.active{border-color:#4272f9}
.review-item .photo-item{display:grid; grid-template-columns:repeat(4, 1fr); gap:20px;}
.review-item .photo-item .img{position:relative; aspect-ratio:214 / 140; border-radius:12px; overflow:hidden; cursor:pointer; background:#000}
.review-item .photo-item .img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:contain; object-position:center;}

/* 댓글 */
.review-item .box.active .reply{display:block;}
.review-item .box.active .reply-btn{border-color:#4272f9}
.review-item .reply{padding:30px 65px; border-top:1px solid #ddd; background:#f5f5f6; display:none;}
.reply-input{display:grid; grid-template-columns:auto 150px; gap:10px; position:relative;}
.reply-input::before{content:''; position:absolute; top:50%; left:-35px; transform:translateY(-50%); width:14px; height:14px; border-left:2px solid #333; border-bottom:2px solid #484847;}
.reply-input input[type="text"]{background:#fff; border-radius:4px; border:1px solid #ddd; padding:0 20px;}
.reply-input textarea{background:#fff; border-radius:4px; border:1px solid #ddd; padding:12px 20px; resize:none; font-family:inherit; font-size:14px; line-height:1.5;}
.reply-input .button{border-radius:4px;}
.reply-item{display:flex; flex-direction:column; gap:15px; margin-top:30px}
.reply-item li{display:flex; align-items:flex-start; justify-content:space-between; gap:20px; font-size:15px;}
.reply-item .text{flex:1; min-width:0; max-width:100%; overflow-wrap:anywhere; word-break:break-word; white-space:pre-wrap;}
.reply-item .info{flex-shrink:0;}
.reply-item .info{font-size:13px; display:flex; align-items:center; gap:10px;}
.reply-item .info div{position:relative; padding-left:10px; display:flex; align-items:center; gap:10px;}
.reply-item .info div::before{content:''; position:absolute; top:4px; left:0; width:1px; height:13px; background:#777;}
.reply-item .info .del{width:46px; height:20px;}

/* 통계 박스 (목록 stats-box / 연수상세 키워드TOP N 공용) */
.review-box{display:grid; grid-template-columns:240px auto; background:url('https://tvcache.teacherville.co.kr/teacherville2/image/web/icon/26_review_back.png'); background-size:cover; border-radius:20px; border:1px solid rgba(221,221,221,.5); }
.review-box.list-none{background-image:url('https://tvcache.teacherville.co.kr/teacherville2/image/web/icon/26_review_none_back.png')}
.review-box.list-none .keyword-box{padding:0; align-items:center; justify-content:center;}
.review-box .stats-box{padding:30px 40px 25px; border-radius:20px; margin:-1px; background:radial-gradient(circle at 85% 75%, rgb(9, 143, 238) 0%, rgba(9, 143, 238, 0.5) 40%, rgba(9, 143, 238, 0) 80%), linear-gradient(135deg, rgb(3, 52, 86) 0%, rgb(3, 52, 86) 100%);}
.review-box .stats-box > div{display:flex; flex-direction:column; gap:30px;}
.review-box .stats-box .tit{font-size:16px; color:rgba(255,255,255,.7); font-weight:500;}
.review-box .rating{display:flex; align-items:baseline; justify-content:right; gap:10px; line-height:1.1; font-size:18px; font-weight:500; color:#fff;}
.review-box strong{font-size:43px; font-family:'Gmarket Sans B'; filter:drop-shadow(0 6px 6px rgba(0,0,0,.15));}
.review-box .star-group{padding-top:15px; margin-top:15px; border-top:1px solid rgba(255,255,255,.2);}
.review-box .star-group strong{font-size:80px; font-weight: bold; background: linear-gradient(to top, #ffec6a 40%, #feca3c 90%); background-clip:text; -webkit-background-clip: text; color:transparent; letter-spacing:-1px; -webkit-text-stroke: 0px transparent;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; -webkit-text-stroke: .1px #feca3c;}
.review-box .star-cnt{gap:6px}
.review-box .star-cnt .star{width:21px; height:21px;}
.review-box .keyword-box{padding:20px 80px; display:flex; flex-direction:column; gap:30px;}
.keyword-box .tit{display:flex; flex-direction:column; gap:10px; line-height:1;}
.keyword-box .tit p{font-weight:bold; color:#000; font-size:20px; letter-spacing:0.5px;}
.keyword-box .tit span{font-size:14px; color:#929292}
.keyword-list{display:flex; flex-direction:column; gap:15px; font-size:14px;}
.keyword-list .item{display:flex; gap:20px; align-items:center; justify-content:space-between;}
.keyword-list .keyword-info{display:flex; gap:15px; align-items:center;}
.keyword-list .number{color:#484d53}
.keyword-list .txt{color:#678ca7}
.keyword-list .graph-cnt{width:60%; display:grid; grid-template-columns:auto 30px; gap:20px; align-items:center; letter-spacing:1.2px; flex-shrink:0;}
.keyword-list .graph{width:100%; position:relative; border-radius:100px; background:#fff; height:9px; filter:drop-shadow(0 3px 8px rgba(0,0,0,.1)); overflow:hidden;}
.keyword-list .graph > div{position:absolute; top:0; left:0; height:100%; border-radius:100px; background:#f36c65}
.keyword-list .item:nth-child(2) .graph > div{opacity:.7;}
.keyword-list .item:nth-child(n + 3) .graph > div{opacity:.5; background:#f79893}
/* ===== 후기 리스트 영역 이관 끝 ===== */

.review-gallery{position:relative; padding-top:30px;}
.review-gallery::before{content:''; position:absolute; top:0; width:100dvw; left:50%; transform:translateX(-50%); height:243px; background:linear-gradient(to right, #098fee 10%, #27c6d9 35%, #29d4f2 65%); z-index:-1;}
.gallery-tit{display:flex; flex-direction:column; gap:10px; line-height:1; margin-bottom:25px;}
.gallery-tit .sub-tit{font-size:13px; color:#5de7ff}
.gallery-tit .tit{font-size:26px; color:#fff; font-weight:bold;}

.review-gallery .review-info{overflow:visible;}
.review-gallery .swiper-slide{background:#fff; border:1px solid #ddd; border-radius:20px; opacity:.3;}
.review-gallery .swiper-slide-prev, .review-gallery .swiper-slide-active, .review-gallery .swiper-slide-next{opacity:1;}
.review-gallery .box{padding:20px;}
.review-gallery .box + .box{border-top:1px solid #ddd;}
.review-gallery .cate-blt{margin:0;}
.review-gallery .tit-info{margin:20px 0 10px; padding:0; border:none;}
.review-gallery .tit-info p{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-gallery .flexbox{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:25px;}
.review-gallery .flexbox .star-cnt{flex:0 0 auto;}
.review-gallery .flexbox .info-item{display:flex; align-items:center; gap:10px; font-size:12px; color:#aaa;}
.review-gallery .flexbox .info-item .name{font-size:12px; font-weight:400; color:#aaa;}
.review-gallery .flexbox .info-item .day{font-size:12px; color:#aaa;}
.review-gallery .flexbox .info-item p + p{position:relative; padding-left:10px;}
.review-gallery .flexbox .info-item p + p::before{content:''; position:absolute; top:3px; left:0; width:1px; height:12px; background:#aaa;}
.review-gallery .review-img{display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; margin:0 0 30px;}
.review-gallery .img{position:relative; aspect-ratio:140 / 120; overflow:hidden; background:#000; border-radius:12px;}
.review-gallery .img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:contain; object-position:center;}
.review-gallery .txt{font-size:14px; color:#777; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; line-height:20px; height:60px;}
.review-gallery .link{display:flex; gap:10px; align-items:center; font-size:16px; font-weight:bold; margin-bottom:20px;}
.review-gallery .link span{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-gallery .link svg{flex-shrink:0;}
.gallery-prev, .gallery-next{position:absolute; top:50%; left:-70px; width:60px; height:60px; display:flex; align-items:center; justify-content:center; border-radius:100%;}
.gallery-prev:hover, .gallery-next:hover{background:#f1f1f1}
.gallery-next{left:auto; right:-70px;}
.gallery-prev svg, .gallery-next svg{width:26px; height:26px;}
.gallery-pagination{display:none;}

.review-event{margin:40px 0; border:1px solid #ddd; border-radius:16px; overflow:hidden;}

.review-detail{margin-bottom:40px; grid-template-columns:345px auto; background:#f5f9fb; border-color:#ddd}
.review-detail .stats-box{background:radial-gradient(circle at 30% 5%, rgb(9, 143, 238) 0%, rgba(9, 143, 238, 0.5) 40%, rgba(9, 143, 238, 0) 80%), linear-gradient(135deg, rgb(3, 52, 86) 0%, rgb(3, 52, 86) 100%);}
.review-detail .stats-box .tit{text-align:right; color:#fff;}
.review-detail .score .rating{position:relative;}
.review-detail .star-group{position:relative;}
.review-detail .star-group .rating{justify-content:left;}
.review-detail .star-group .tit{position:absolute; right:0; top:20px;}
.review-detail .star-group .noti{position:absolute; right:0; bottom:30px; font-size:14px; color:rgba(255,255,255,.5)}

.keyword-sort{display:flex; flex-direction:column; gap:15px; padding:25px 35px;}
.keyword-sort .tit{display:flex; gap:30px; align-items:flex-end;}
.keyword-sort .tit p{font-size:20px; font-weight:bold; color:#000;}
.keyword-sort .tit div{display:flex; gap:10px; align-items:center; color:#989ea6; font-size:15px;}
.keyword-sort .item{display:flex; flex-direction:column; gap:7px;}
.keyword-sort .cate{font-size:13px; font-weight:500; color:#aaa}
.txt-chk{display:flex; gap:10px; flex-wrap:wrap;}
.txt-chk input{display:none;}
.txt-chk label{display:inline-block; height:34px; line-height:32px; background:#fff; border:1px solid #ccc; padding:0 10px; font-size:15px; color:#999; border-radius:100px; letter-spacing:-1px;}
.txt-chk input:checked + label{background:#7f7f7f; border-color:#7f7f7f; color:#fff;}

.keyword-slt{display:flex; gap:10px;}
.keyword-slt .keyword{display:inline-block; height:34px; line-height:32px; border-radius:100px; font-size:15px; border:1px solid #ccc; background:#fff; color:#4272f9; font-weight:bold; padding:0 20px}
.keyword-slt-list{display:flex; gap:10px;}
.keyword-slt .keyword-pop-btn{border:1px dashed #4272f9; color:#4272f9; padding:0 30px; font-weight:bold;}
.keyword-slt .num{padding:0 15px; color:#000; letter-spacing:1px; font-weight:500; background:#eaeaea}
.keyword-slt .reset{margin:0; color:#999; text-decoration:underline; text-underline-offset:3px; background:none; border:none; padding:0 10px; font-weight:500;}

.new_pop.md{max-width:780px; width:calc(100% - 20px)}
.keyword-pop .title{padding:20px}
.new_pop .title .txt{color:#989ea6; font-size:14px; margin-top:5px;}
.keyword-pop .keyword-con{display:flex; padding:0; max-height:60dvh;}
.keyword-pop .keyword-con > div{width:100%; padding:20px; display:flex; flex-direction:column; gap:10px;}
.keyword-pop .keyword-con > div + div{border-left:1px solid #ddd;}
.keyword-con .cate{font-size:12px; color:#aaa}
.keyword-chk input{display:none;}
.keyword-chk label{display:flex; gap:10px; align-items:center; font-size:14px; padding:10px 20px; border-radius:8px;}
.keyword-chk label:hover{background:#f5f5f6}
.keyword-chk input:checked + label{color:#fff; background:#7f7f7f}
.keyword-pick ul{display:none; gap:10px; flex-wrap:wrap; padding:15px 20px; background:#f5f9fb; border-top:1px solid #ddd;}
.keyword-pick li{background:#fafafb; font-size:14px; font-weight:bold; color:#4272f9; border:1px solid #ddd; border-radius:100px; padding:0 20px; height:34px; line-height:32px; animation:tagFade 0.2s ease;}
@keyframes tagFade {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}
.keyword-pop .keyword-btn-wrap{padding:15px 20px; border-top:1px solid #ddd; display:flex; flex-direction:column;}
.keyword-pick .num{font-size:12px; color:#777}
.keyword-pick .num strong{color:#000; font-weight:500;}
.keyword-pop .keyword-btn{display:flex; justify-content:right; gap:10px;}
.keyword-pop .keyword-btn button{width:115px}

.review-sort-wrap{margin-bottom:30px;}
.slt-search{display:grid; grid-template-columns:110px 290px; gap:10px;}
.slt-search .custom-select{width:100%}
.search-wrap{width:100%; border:1px solid #ddd; border-radius:5px; height:40px; display:grid; grid-template-columns:auto 20px; gap:10px; padding:0 15px}
.search-wrap input{height:100%; border:none; font-size:15px; padding:0}
.search-wrap input::placeholder{color:#aaa}
.search-wrap svg{vertical-align:middle; margin-top:-3px}
.review-sort .edit{display:flex; gap:20px; align-items:center;}
.review-sort .edit label.checkbox{display:inline-flex; align-items:center; gap:8px; color:#777; font-size:15px; cursor:pointer; flex-shrink:0;}
.review-sort .edit label.checkbox input[type="checkbox"]{width:18px; height:18px; margin:0; cursor:pointer; accent-color:#4272f9;}
.review-sort .edit button{width:140px}
.review-sort-wrap .review-num{text-align:right; color:#777; font-size:13px; font-weight:normal;}

/* 목록 영역 — common_230906 .reply-list-box border-top(#474747) 미적용 */
#newReviewListRoot .reply-list-box{border-top:none;}

/* 연수상세 후기 카드 — 카테고리 라벨·연수명 숨김 (과정 컨텍스트가 이미 고정되어 불필요) */
#review-info #newReviewListRoot .cate{display:none;}

/* 나의후기(trainReviewUseList) 전용 — 후기 유의사항 영역 하단 여백 (전역 .exam-study-area 미수정, 이 페이지만) */
.exam-study-area.review-use-notice{margin-bottom:45px;}

/* 카드 뱃지 — 퍼블 newCreditCourseDetail.css .cate-blt (라이브 병합 누락분) */
#newReviewListRoot .cate-blt{display:flex; gap:10px; margin:20px 0 15px; flex-shrink:0;}
#newReviewListRoot .cate-blt.gray{flex-wrap:wrap;}
#newReviewListRoot .cate-blt.gray label{background:#f2f2f2;}
#newReviewListRoot .cate-blt label{display:inline-block; line-height:22px; padding:0 10px; border-radius:5px; background:#e0f6ff; font-size:12px; color:#626262;}
#newReviewListRoot .review-item .text-item .cate-blt{margin:0;}
#newReviewListRoot .review-item .info-item .cate-blt.gray.mb0{margin-bottom:0;}
#newReviewListRoot .review-gallery .cate-blt{margin:0;}

/* 연수후기작성 */
.top-tit-wrap{display:flex; flex-direction:column; gap:20px; margin-bottom:30px;}
.top-tit-wrap h2{font-size:23px; font-weight:bold;}
.top-tit-wrap .txt{color:#777; font-size:15px;}

.review-cate{display:grid; grid-template-columns:repeat(2, 1fr); gap:20px;}
.review-cate .box{border-radius:12px; background:#f5f9fb; padding:20px; display:flex; flex-direction:column; gap:20px;}
.review-tit{display:flex; flex-direction:column; gap:10px;}
.review-tit .tit{font-weight:bold; display:flex; gap:5px;}
.review-tit strong{color:#ff3535}
.review-tit .txt{color:#777}
.review-tit ul{display:flex; flex-direction:column; gap:5px;}
.review-tit li{position:relative; padding-left:15px; color:#777}
.review-tit li::before{content:'ㆍ'; position:absolute; top:0; left:0;}
.review-cate .cont-area{flex-grow:1; display:flex; flex-direction:column; justify-content:center;}
.review-cate .com-select{width:100%;}
.review-cate .star-wrap{display:grid; grid-template-columns:auto 95px; gap:20px; align-items:flex-end; justify-content:center;}
.review-cate .star-cnt{gap:10px;}
.review-cate .star{width:38px; height:38px; cursor:pointer;}
.review-cate .star-wrap .txt{color:#777; white-space:nowrap}
.review-cate .cate-box{grid-column:2 / 3; grid-row:1 / 3;}
.review-cate .item{display:flex; flex-direction:column; gap:10px;}
.review-cate .item .cate{font-size:13px; color:#6b8495}

.review-edit{display:flex; flex-direction:column; gap:20px; padding:40px; border-radius:12px; bordER:1px solid #ddd; margin-top:35px}
.review-edit .radio-list{gap:30px;}
/* 한쪽 유형 기 작성 시 안내 문구 — placeholder급 작은 회색 (#13) */
#newReviewAddRoot .new-type-noti{margin-top:-10px; font-size:12px; color:#aaa;}
/* 후기유형 라디오 비활성(기 작성 유형) — appearance:none이라 기본 비활성 표시 안 먹어 명시 (#12) */
#newReviewAddRoot .radio.is-disabled{color:#bbb;}
#newReviewAddRoot .radio.is-disabled input[type="radio"]{background:#f2f2f2; border-color:#e0e0e0; cursor:not-allowed;}
#newReviewAddRoot .radio.is-disabled input[type="radio"]:checked::before{background:#bbb;}

.review-bottom{margin-top:40px; display:flex; justify-content:space-between; align-items:center;}
.review-bottom .btn-cnt{display:flex; gap:10px;}
.review-bottom .btn-cnt .button{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:120px; height:48px; padding:0 40px; border-radius:8px;
  font-size:17px; font-weight:500; cursor:pointer;
  color:#333; border:1px solid #ddd; background:#fff;
}
.review-bottom .btn-cnt .button.bk_blue1{color:#fff; background:#4272f9; border:none;}

/* 작성 화면 입력란 — 퍼블 .input/.textarea (common_230906) 동일, 작성 vm 단독 로드 대비 명시 */
#newReviewAddRoot .input{width:100%; height:50px; padding:0 20px; font-size:15px; border:1px solid #ddd; border-radius:5px;}
#newReviewAddRoot .textarea{width:100%; padding:20px; font-size:15px; line-height:1.5; border:1px solid #ddd; border-radius:5px;}
#newReviewAddRoot .input::placeholder, #newReviewAddRoot .textarea::placeholder{color:#aaa;}
/* 과정 선택 드롭다운 — native 화살표 제거 + 우측 화살표를 select 배경으로 (com-select::before가 z-index에 가려지는 문제 회피) */
#newReviewAddRoot .com-select select{-webkit-appearance:none; -moz-appearance:none; appearance:none; background:#fff url(../images/icon/ic_select_arrow.png) no-repeat right 12px center;}

/* 작성 화면 첨부 — 퍼블 attach-list (common_230906 블록과 동일, 작성 vm 단독 로드 대비) */
#newReviewAddRoot .attach-wrap{display:flex; flex-direction:column; gap:20px;}
#newReviewAddRoot .attach-photo input[type="file"]{display:none;}
#newReviewAddRoot .attach-photo label{
  border:2px dashed #ccc; border-radius:12px; background:#f5f9fb;
  display:flex; align-items:center; justify-content:center; gap:10px;
  height:50px; font-size:15px; color:#333; cursor:pointer;
}
#newReviewAddRoot .attach-noti{display:flex; gap:5px; align-items:flex-start; font-size:13px; color:#aaa;}
#newReviewAddRoot .attach-list{
  display:grid; grid-template-columns:repeat(4, 1fr); gap:20px;
  padding:20px; border-radius:12px; border:1px solid #ddd;
}
#newReviewAddRoot .attach-list .item{
  position:relative; aspect-ratio:140 / 120; overflow:hidden;
  background:#000; border-radius:12px;
}
#newReviewAddRoot .attach-list .item img{
  position:absolute; top:0; left:0; width:100%; height:100%;
  object-fit:contain; object-position:center;
}
#newReviewAddRoot .attach-list .remove{
  position:absolute; top:10px; right:10px; background:#fff; border-radius:100%;
  width:30px; height:30px; display:flex; align-items:center; justify-content:center;
  border:none; cursor:pointer; padding:0; z-index:1;
}


@media (max-width: 767px) {
  .review-title{gap:10px; margin:20px 0 30px;}
  .review-title .sub-tit{font-size:14px;}
  .review-title .tit{font-size:24px; line-height:1.2; text-align:center;}

  .gallery-tit{flex-direction:row; align-items:flex-end;}
  .gallery-tit .tit{font-size:16px;}
  .review-gallery{padding:20px 0}
  .review-gallery::before{height:100%;}
  .review-gallery .swiper-slide{border-radius:10px;}
  .review-gallery .box{padding:10px}
  .review-gallery .tit-info{margin:10px 0}
  .review-gallery .flexbox{margin-bottom:10px;}
  .review-gallery .review-img{margin:0 0 10px;}
  .review-gallery .link{font-size:14px; margin-bottom:10px;}
  .review-gallery .cate-blt.gray{gap:5px;}
  .gallery-pagination{display:flex; justify-content:center; gap:5px; margin-top:20px;}
  .gallery-pagination .swiper-pagination-bullet{width:10px; height:10px; margin:0 !important; background:#fff;}

  .review-event{margin:0 -10px 30px; border-radius:0; border:none}
  
  .review-detail .stats-box .tit{text-align:left;}
  .review-detail .star-group .tit{position:relative; top:0;}
  .review-detail .star-group .noti{display:none;}

  .keyword-sort{padding:20px 10px; gap:25px;}
  .keyword-sort .tit{flex-direction:column; gap:10px; align-items:flex-start;}
  .keyword-sort .tit p{font-size:16px;}
  .keyword-sort .tit div{font-size:12px; gap:5px;}
  .keyword-sort .tit svg{width:12px; height:12px;}

  .txt-chk, .keyword-pick ul{gap:5px;}
  .txt-chk label, .keyword-slt .keyword, .keyword-pick li{font-size:13px; height:30px; line-height:28px; padding:0 10px;}
  .keyword-slt{flex-wrap:wrap;}
  
  .keyword-pop .title, .keyword-pop .keyword-con > div, .keyword-pick ul, .keyword-pop .keyword-btn-wrap{padding:15px}
  .keyword-pop .title .txt{font-size:12px;}
  .keyword-pop .keyword-con{flex-direction:column;}
  .keyword-pop .keyword-con > div + div{border-top:1px solid #ddd; border-left:0}
  .keyword-chk label{padding:10px;}
  .keyword-pick ul{max-height:10dvh; overflow:auto;}

  .review-sort-wrap{display:flex; flex-direction:column; gap:15px;}
  /* 퍼블 모바일 순서: 정렬탭 → 검색 → (내후기+후기작성) → 개수.
     블록 DOM은 [정렬+edit],[검색] 2그룹 → review-sort를 display:contents로 평탄화 후 order로 재배치 (데스크탑 무영향) */
  .review-sort-wrap > .review-sort{display:contents;}
  .review-sort-wrap .sorting{order:1;}
  .review-sort-wrap .slt-search{order:2;}
  .review-sort-wrap .edit{order:3;}
  .review-sort-wrap .review-num{order:4;}
  .review-sort-wrap .review-sort{gap:20px;}
  .review-sort-wrap .review-sort .sorting{width:auto}
  .slt-search{grid-template-columns:80px auto; width:100%;}
  .search-wrap{padding:0 10px; height:34px;}
  .search-wrap input{font-size:13px;}
  .search-wrap svg{width:15px; height:15px;}
  .review-sort .edit{justify-content:right; width:100%;}
  .review-sort .edit label.checkbox{font-size:13px;}
  .review-sort .edit button{width:auto}

  .review-item .text-item .cate p{overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:13px;}


  /* 연수후기작성 */
  .top-tit-wrap{gap:10px;}
  .top-tit-wrap h2{font-size:18px;}
  .top-tit-wrap .txt, .review-tit .txt, .review-cate .star-wrap .txt{font-size:13px;}
  
  .review-cate{display:flex; flex-direction:column; gap:10px;}
  .review-cate .box{padding:10px;}
  .review-cate .star{width:24px; height:24px}
  .review-tit{gap:5px;}
  .review-tit .tit{font-size:15px;}

  .review-edit{padding:10px}
  .review-edit .radio-list{display:grid; grid-template-columns:repeat(2, 1fr); gap:0;}
  .review-bottom{flex-direction:column; gap:20px;}
  .review-tit ul{font-size:13px;}
  .review-bottom .btn-cnt{width:100%}
  .review-bottom .btn-cnt .button{width:100%; height:38px; font-size:14px; padding:0 15px; border-radius:4px;}
  #newReviewAddRoot .input, #newReviewAddRoot .textarea{font-size:14px;}
  #newReviewAddRoot .input{height:40px; padding:0 10px;}
  #newReviewAddRoot .textarea{padding:10px;}
  #newReviewAddRoot .attach-photo label{font-size:14px;}
  #newReviewAddRoot .attach-list{padding:10px; grid-template-columns:repeat(2, 1fr); gap:10px;}
}

/* ===== 후기 리스트 영역 반응형 — newCreditCourseDetail.css 에서 이관 ===== */
@media (max-width: 1000px) {
  .review-sort .sorting button{font-size:15px;}
  .review-item .item{padding:0 0 20px 0; grid-template-columns:150px auto; gap:10px;}
  .review-item .box + .box{margin-top:20px;}
  .review-item .text-item{gap:15px;}
  .review-item .tit{font-size:16px;}
  .review-item .txt{font-size:14px;}
}
@media (max-width: 767px) {
  .review-sort{margin-bottom:0;}
  .review-sort .sorting{gap:30px; width:100%;}
  .review-sort .sorting button{font-weight:normal;}
  /* .review-sort .custom-select{width:102px} 제거 — 연수상세(newCreditCourseDetail.css) 잔재. 후기 퍼블 모바일은 .slt-search .custom-select{width:100%}(80px 셀에 맞춤) */
  .review-sort .btn-cnt{order:3;}
  .review-num{width:auto; order:2; font-size:14px}
  .review-item .item{display:flex; flex-direction:column; gap:20px;}
  .review-item .star-cnt{margin-bottom:0;}
  .review-item .day{position:absolute; top:2px; right:0; font-size:12px;}
  .review-item .name{font-weight:normal;}
  .review-item .text-item{gap:10px;}
  .review-item .tit{font-size:15px;}
  .review-item .photo-item{grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:10px;}
  .review-item .photo-item .img{border-radius:5px;}
  .review-item .txt{font-size:13px; -webkit-line-clamp:4}
  .review-item .btn-item svg{width:12px; height:12px;}
  .review-item .reply{padding:20px 10px 20px 30px;}
  .reply-input{grid-template-columns:auto 75px;}
  .reply-input::before{left:-17px; width:7px; height:7px; border-width:1px;}
  .reply-input input[type="text"]{padding:0 10px;}
  .reply-input textarea{padding:8px 10px;}
  .reply-input .button{height:34px; padding:0; font-size:13px;}
  .reply-item{margin-top:20px; gap:20px;}
  .reply-item li{font-size:13px; flex-direction:column; gap:5px; align-items:flex-start;}
  .reply-item .text{order:2;}
  .reply-item .info{font-size:11px; color:#aaa; order:1; width:100%; justify-content:space-between;}
  .reply-item .info div::before{content:none;}

  /* 통계 박스 반응형 */
  .review-box{display:flex; flex-direction:column; border-radius:10px; overflow:hidden; border-color:rgba(221,221,221,.2)}
  .review-box.list-none{background-image:url('https://tvcache.teacherville.co.kr/teacherville2/image/web/icon/26_review_none_back_m.png')}
  .review-box .stats-box{border-radius:0; padding:20px; display:flex; align-items:flex-start; justify-content:center;}
  .review-box .stats-box > div{gap:10px; width:100%; padding:0 5vw; margin:0}
  .review-box .stats-box .score{gap:20px;}
  .review-box .star-group{border-left:1px solid rgba(221,221,221,.2); border-top:none;}
  .review-box .stats-box .tit{font-size:13px; color:#fff}
  .review-box .rating{justify-content:left; font-size:14px; gap:5px;}
  .review-box .rating strong{font-size:35px;}
  .review-box .star-group strong{font-size:50px;}
  .review-box .star-cnt{gap:3px;}
  .review-box .star-cnt .star{width:14px; height:14px;}
  .review-box .keyword-box{padding:20px;}
  .keyword-box .tit p{font-size:16px;}
  .keyword-box .tit span{font-weight:13px;}
  .keyword-list{font-size:13px;}
  .keyword-list .item{gap:10px;}
  .keyword-list .keyword-info{gap:10px;}
}

/* BEST 갤러리: 베스트 후기가 적을 때(카드 ≤ 3, JS가 .best-few 부여) — Swiper 버전 무관 처리.
   카드 페이드/내비 끄고, wrapper transform 무력화 + flex center로 강제 중앙정렬. */
.review-gallery.best-few .swiper,
.review-gallery.best-few .swiper-wrapper{overflow:visible;}
.review-gallery.best-few .swiper-slide{opacity:1 !important;}
.review-gallery.best-few .swiper-wrapper{width:100% !important; justify-content:center; transform:none !important;}
.review-gallery.best-few .swiper-slide:last-child{margin-right:0 !important;}
.review-gallery.best-few .gallery-prev,
.review-gallery.best-few .gallery-next{display:none;}


/* ===== 후기 목록 페이지네이션 (#newDivPaging) =====
   퍼블 미제공 → 페이지 무드(블루 #4272f9·라운드·라이트)에 맞춰 자체 디자인.
   getNavigator 출력: a.direction(first/prev/next/end) + 페이지번호 a + 현재페이지 strong */
#newDivPaging{display:flex; justify-content:center; align-items:center; gap:6px; flex-wrap:wrap; margin:50px 0 10px;}
#newDivPaging a, #newDivPaging strong{
    display:inline-flex; align-items:center; justify-content:center;
    min-width:38px; height:38px; padding:0 8px; box-sizing:border-box;
    border-radius:10px; font-size:15px; font-weight:500; color:#555;
    text-decoration:none; cursor:pointer;
    transition:background .15s ease, color .15s ease, border-color .15s ease;
}
#newDivPaging a:hover{background:#eef3fd; color:#4272f9;}
#newDivPaging strong{background:#4272f9; color:#fff; font-weight:bold; cursor:default;}
/* 방향 버튼: 한글 텍스트 숨기고 화살표(chevron) 아이콘으로 */
#newDivPaging a.direction{font-size:0; border:1px solid #e0e0e0; color:#888;}
#newDivPaging a.direction::before{font-size:17px; line-height:1; color:#888; transition:color .15s ease;}
#newDivPaging a.direction.first::before{content:'\00AB';}
#newDivPaging a.direction.prev::before{content:'\2039';}
#newDivPaging a.direction.next::before{content:'\203A';}
#newDivPaging a.direction.end::before{content:'\00BB';}
#newDivPaging a.direction:hover{background:#f5f9fb; border-color:#4272f9;}
#newDivPaging a.direction:hover::before{color:#4272f9;}

@media (max-width: 767px) {
  #newDivPaging{gap:4px; margin:30px 0 10px;}
  #newDivPaging a, #newDivPaging strong{min-width:32px; height:32px; font-size:14px; border-radius:8px;}
  #newDivPaging a.direction::before{font-size:15px;}
}