/* 헤더 장바구니 아이콘 (cart.html과 동일) */
.nemu_tri .nemu_cart { position: relative; }
.nemu_tri .nemu_cart > a { display:inline-block; position:relative; line-height:1; vertical-align:middle; }
.nemu_tri .nemu_cart .ic_cart { width:26px; height:26px; display:inline-block; vertical-align:middle; }
.nemu_tri .nemu_cart .cart-cnt { position:absolute; top:-8px; right:-12px; min-width:18px; height:18px; padding:0 5px;
border-radius:9px; background:#D14905; color:#fff; font-size:11px; font-weight:700; line-height:18px; text-align:center; box-shadow:0 0 0 2px rgba(0,0,0,.15); }
/* [CART-NEW] 목록 상단 담기 툴바 */
.gl_toolbar { display:flex; align-items:center; gap:14px; background:#fff; border:1px solid #e2e8f0; border-radius:10px; padding:12px 18px; margin:14px 0; }
.gl_toolbar .gl_sel { margin-left:auto; font-size:15px; color:#555; }
.gl_toolbar .gl_sel b { color:#2075dd; }
/* 분류(파랑) — officer.do 스타일 */
.my_lecture .my_lect_td li .gl_cate { color:#2075dd; font-weight:600; }
/* 260827 - 모집기간 칸 넘치는 문제 */
.my_lecture .my_lect_td .text_date {width: 100%;font-size: 17px;word-break: keep-all;}
/* 정원/상태 보조 텍스트 */
#glList li > span p.gl_seats { display:block; width:100%; margin:5px 0 0; white-space:nowrap; color:#888; font-size:14px; }
/* 선택 행 하이라이트 */
#glList li.is-checked { background:#f4f9ff; }
/* [CART-NEW] 행 세로 중앙 정렬 보정 — 상태 칸(버튼+정원 2줄)이 높아도 나머지 칸은 중앙 유지
(외부 dsub.css가 1280px 이하부터 모바일 리스트 패턴으로 전환되므로 분기점을 1281px로 일치) */
@media (min-width:1281px){
body #glList > li { display:flex; align-items:center; }
body #glList > li > span { float:none; display:flex; flex-wrap:wrap; align-items:center; align-content:center; justify-content:center; }
body #glList > li > span.t_left { justify-content:flex-start; }
/* 260827 - 과정명 텍스트 칸 넘치는 문제 */
#cartList > li > span {flex-wrap: wrap;}
}
/* 담기 버튼(행) */
.gl_addbtn .ic { width:16px; height:16px; vertical-align:-3px; margin-right:5px; }
/* ============================================================
[CART-NEW] 반응형 보정 (1280px 이하) — 행을 카드형으로 재구성
외부 CSS(dsub.css)의 모바일 리스트 패턴(my_mo_th)은 1280px 이하부터
적용되며 컬럼 구성이 달라 깨지므로 숨기고, 각 행(li)을 독립 카드로 표시한다.
============================================================ */
@media (max-width:1280px){
/* 헤더행/모바일 헤더 숨김 */
body .my_lecture .my_lect_th { display:none; }
body #glList > li .my_mo_th { display:none !important; }
body #glList { display:block; width:100%; }
body #glList > li {
display:block; float:none; position:relative; box-sizing:border-box;
width:100%; height:auto; min-height:0;
margin:0 0 14px; padding:18px 16px 16px 56px;
background:#fff; border:1px solid #e2e8f0; border-radius:12px;
}
body #glList > li:after { content:""; display:block; clear:both; }
body #glList > li.is-checked { background:#f4f9ff; }
/* 셀 공통: 블록 줄로 풀기 */
body #glList > li > span {
float:none; display:block; box-sizing:border-box;
width:100% !important; height:auto; min-height:0;
margin:0 0 8px; padding:0; border:0;
text-align:left; line-height:1.5;
}
body #glList > li > span p { display:inline; margin:0; white-space:normal; }
/* 1) 체크박스 — 카드 좌상단 고정 */
body #glList > li > span:nth-of-type(1) {
position:absolute; left:14px; top:19px; width:auto !important; margin:0;
}
/* 2) 분류 */
body #glList > li > span:nth-of-type(2) .gl_cate { font-size:14px; }
body #glList > li > span:nth-of-type(2) { margin-bottom:4px; }
/* 3) 과정명 */
body #glList > li > span:nth-of-type(3) a,
body #glList > li > span:nth-of-type(3) p {
font-size:17px; font-weight:600; line-height:1.45; word-break:keep-all;
}
/* 4) 모집기간 / 6) 교육시간 — 라벨 표시 */
body #glList > li > span:nth-of-type(4),
body #glList > li > span:nth-of-type(6) { font-size:15px; color:#555; margin-bottom:4px; }
body #glList > li > span:nth-of-type(4):before { content:"모집기간"; }
body #glList > li > span:nth-of-type(6):before { content:"교육시간"; }
body #glList > li > span:nth-of-type(4):before,
body #glList > li > span:nth-of-type(6):before {
display:inline-block; margin-right:8px; color:#98a2ae; font-size:13px;
}
/* 5) 유형 / 7) 상태 — 뱃지 인라인 배치 */
body #glList > li > span:nth-of-type(5),
body #glList > li > span:nth-of-type(7) {
display:inline-block; width:auto !important; vertical-align:middle;
margin:4px 8px 6px 0;
}
body #glList > li > span:nth-of-type(5) .btn,
body #glList > li > span:nth-of-type(7) .btn {
display:inline-block; float:none; width:auto; height:auto;
line-height:1.4; padding:4px 12px; font-size:14px;
}
body #glList li > span p.gl_seats {
display:inline; width:auto; margin:0 0 0 8px; font-size:13px; vertical-align:middle;
}
/* 8) 담기 버튼 — 카드 하단 풀폭 */
body #glList > li > span:nth-of-type(8) { display:block; margin:8px 0 0; }
body #glList > li > span:nth-of-type(8) .gl_addbtn {
display:block; width:100% !important; height:46px !important; line-height:46px !important;
}
body #glList li.gl_off .gl_addbtn_off { height:46px; }
/* 담기 툴바 — 좁은 화면에서 줄바꿈 허용 */
.gl_toolbar { flex-wrap:wrap; gap:10px; padding:12px 14px; }
.gl_toolbar .gl_sel { font-size:14px; }
}
/* 마감 행 */
#glList li.gl_off { background:#fafbfc; }
#glList li.gl_off .fm_ch { opacity:.4; pointer-events:none; }
#glList li.gl_off > span p { color:#9aa3ad; }
/* [CART-NEW] 담기 비활성화 버튼 — 세로 중앙 정렬 + 명확한 disabled 표현 */
#glList li.gl_off .gl_addbtn_off {
display:inline-flex; align-items:center; justify-content:center; gap:6px;
width:100%; height:42px; padding:0; line-height:1;
background:#eef1f4; border:1px solid #d4dae0; border-radius:6px;
color:#8b95a1; font-weight:600; cursor:not-allowed; box-shadow:none;
}
#glList li.gl_off .gl_addbtn_off .ic { width:15px; height:15px; flex:none; }
/* 담기 토스트 */
.cart_toast { position:fixed; left:50%; bottom:48px; transform:translateX(-50%) translateY(20px); background:#222b36; color:#fff;
padding:14px 22px; border-radius:30px; font-size:16px; opacity:0; pointer-events:none; transition:.25s; z-index:9999; box-shadow:0 8px 24px rgba(0,0,0,.25); }
.cart_toast.on { opacity:1; transform:translateX(-50%) translateY(0); }
.cart_toast a { color:#7db8ff; font-weight:700; margin-left:10px; text-decoration:underline; pointer-events:auto; }
/* CTA: 장바구니 담기 + 신청하기 동일 크기로 나란히 */
.btn_box .cart_cta_wrap { display:inline-flex; gap:12px; vertical-align:middle; }
.btn_box .cart_cta_wrap .btn { height:64px; line-height:64px; min-width:230px; padding:0 26px; }
.btn_box .cart_cta_wrap .btn.cart_addbtn { font-weight:600; }
.btn_box .cart_cta_wrap .btn.cart_addbtn .ic { width:22px; height:22px; vertical-align:-4px; margin-right:8px; }
@media all and (max-width:1024px){
.btn_box .cart_cta_wrap { display:flex; }
.btn_box .cart_cta_wrap .btn { flex:1; min-width:0; height:96px; line-height:96px; }
}
/* 관심강좌(하트) 버튼 */
.education_tit_row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.btn_favorites.cart_heart { width:48px; height:48px; border:1px solid #e0e0e0; border-radius:50%; background:#fff; flex:none;
display:grid; place-items:center; cursor:pointer; transition:.15s; }
.btn_favorites.cart_heart svg { width:24px; height:24px; }
.btn_favorites.cart_heart .hf { fill:none; stroke:#c14; stroke-width:1.8; }
.btn_favorites.cart_heart.on { background:#fdeef0; border-color:#f3c2cb; }
.btn_favorites.cart_heart.on .hf { fill:#e2436b; stroke:#e2436b; }
/* 담기 안내 토스트 */
.cart_toast { position:fixed; left:50%; bottom:48px; transform:translateX(-50%) translateY(20px);
background:#222b36; color:#fff; padding:14px 22px; border-radius:30px; font-size:16px; opacity:0; pointer-events:none;
transition:.25s; z-index:9999; box-shadow:0 8px 24px rgba(0,0,0,.25); }
.cart_toast.on { opacity:1; transform:translateX(-50%) translateY(0); }
.cart_toast a { color:#7db8ff; font-weight:700; margin-left:10px; text-decoration:underline; pointer-events:auto; }
/* 헤더 우측 장바구니 아이콘 + 카운트 뱃지 */
.nemu_tri .nemu_cart { position: relative; }
.nemu_tri .nemu_cart > a { display: inline-block; position: relative; line-height: 1; vertical-align: middle; }
.nemu_tri .nemu_cart .ic_cart { width: 26px; height: 26px; display: inline-block; vertical-align: middle; color: #fff; }
.nemu_tri .nemu_cart .cart-cnt {
position: absolute; top: -8px; right: -12px; min-width: 18px; height: 18px; padding: 0 5px;
border-radius: 9px; background: #D14905; color: #fff; font-size: 11px; font-weight: 700;
line-height: 18px; text-align: center; box-shadow: 0 0 0 2px rgba(0,0,0,.15);
}
/* 톤 다운: 헤더가 어두운 배경이 아닐 경우 대비 */
.menu_tbg .nemu_tri .nemu_cart .ic_cart { color: inherit; }
/* 안내 박스 */
.cart_notice {
display: flex; gap: 8px; align-items: flex-start;
margin: 0 40px 10px; padding: 14px 18px;
background: #eef4fc; border: 1px solid #cfe0f5; border-radius: 8px;
color: #1b4f86; font-size: 15px; line-height: 1.5;
margin-top:10px;
}
.cart_notice b { color: #15589e; }
/* 타이틀 우측 요약 (담은 강좌 N건 옆) */
.cart_summary { color: #777; font-weight: 400; }
.cart_summary .ok { color: #1c7d55; font-weight: 700; }
.cart_summary .no { color: #D14905; font-weight: 700; }
/* 정원 표시 (사이트 CSS가 li>span p 를 inline-block 처리 → block으로 덮어써 뱃지 아래로 줄바꿈) */
#cartList li > span p.cart_seats { display:block; width:100%; margin:6px 0 0; white-space:nowrap; color:#666; font-size:15px; }
#cartList li > span p.cart_seats.tight { color:#D14905; font-weight:700; }
/* [CART-FIX] 데스크톱: 모바일용 행 헤더 숨김 + 행 내용 세로 중앙 정렬 */
@media all and (min-width: 1025px){
#cartList > li .my_mo_th { display: none !important; }
#cartList > li { display: flex; align-items: center; }
#cartList > li > span { float: none; display: flex; flex-direction: column; justify-content: center;}
#cartList > li > span:not(.t_left) { align-items: center; }
#cartList > li > span.t_left { align-items: flex-start; }
}
/* 마감(비활성) 행: 살짝 흐리게 */
#cartList li.cart_off { background: #fafafa; }
#cartList li.cart_off .wid_5p .fm_ch { opacity: .4; pointer-events: none; }
#cartList li.cart_off p:not(.txt_cenlin) { color: #999; }
/* 마감 안내 라벨 */
.cart_offmsg { display:inline-block; margin-top:6px; font-size:14px; color:#D14905; font-weight:600; }
.cart_offmsg.gray { color:#777; }
/* 하단 일괄신청 영역 */
.cart_btnbox { padding: 10px 0 0; }
.cart_selinfo { color:#333; }
.cart_selinfo b { color:#2075dd; font-size: 22px; }
.cart_btnbox .cart_bigbtn {
display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
min-width: 200px; height: 64px; line-height: 1; padding: 0 20px; margin: 0 6px; font-size: 20px; box-sizing: border-box;
}
.cart_btnbox .cart_bigbtn span { line-height: 1; }
@media all and (max-width: 1024px){
.cart_notice { margin: 0 0 10px; font-size: 26px; }
.cart_btnbox .cart_bigbtn { min-width: 0; width: 47%; height: 96px; line-height: 1; font-size: 28px; }
}
/* [CART-FIX] 모바일(반응형): 사이트 표형 CSS와 충돌해 리스트가 깨지는 문제 → 카드형으로 재배치 */
@media all and (max-width: 1024px){
.my_lecture .my_lect_th { display: none !important; }
/* 260827 - 모집기간 칸 넘치는 문제 */
.my_lecture .my_lect_td .text_date br {display: none;}
#cartList { display: block; }
#cartList > li {
position: relative !important; display: flex !important; flex-wrap: wrap; align-items: center;
gap: 10px 16px; width: 100% !important; height: auto !important; min-height: 0 !important;
box-sizing: border-box; margin: 0 0 20px !important; padding: 28px 24px 28px 92px !important;
border: 1px solid #e3e3e3 !important; border-radius: 12px; background: #fff;
overflow: visible !important;
}
#cartList > li.cart_off { background: #fafafa; }
#cartList > li .my_mo_th { display: none !important; }
#cartList > li > span {
position: static !important; float: none !important; display: block !important;
width: auto !important; max-width: 100%; height: auto !important; min-height: 0 !important;
margin: 0 !important; padding: 0 !important; border: 0 !important;
text-align: left !important; line-height: 1.45;
}
#cartList > li > span p { display: inline; margin: 0; }
/* 1열: 체크박스 — 카드 좌측 중앙 고정 */
#cartList > li > span:nth-of-type(1) {
position: absolute !important; left: 24px; top: 50%; transform: translateY(-50%); z-index: 1;
}
#cartList > li > span:nth-of-type(1) .icon_del { display: none !important; }
#cartList > li > span:nth-of-type(1) label { margin: 0 !important; }
/* 3열: 과정명 — 첫 줄 전체 폭 (우측 삭제버튼 공간 확보) */
#cartList > li > span:nth-of-type(3) { order: 1; width: 100% !important; padding-right: 110px !important; font-weight: 700; word-break: keep-all; }
#cartList > li > span:nth-of-type(3) p { display: block; }
/* 2열: 분류 / 4열: 모집기간 */
#cartList > li > span:nth-of-type(2) { order: 2; color: #777; }
#cartList > li > span:nth-of-type(4) { order: 3; color: #777; }
/* 5열: 유형 / 6열: 상태 — 뱃지 줄 */
#cartList > li > span:nth-of-type(5) { order: 4; }
#cartList > li > span:nth-of-type(6) { order: 5; display: flex !important; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
/* 7열: 삭제 버튼 — 카드 우측 상단 고정 */
#cartList > li > span:nth-of-type(7) { order: 6; position: absolute !important; right: 20px; top: 20px; width: auto !important; }
/* 정원/마감 안내 텍스트 줄바꿈 허용 */
#cartList li > span p.cart_seats { display: inline !important; width: auto !important; margin: 0 !important; white-space: normal !important; }
#cartList .cart_offmsg { display: block; margin-top: 6px; white-space: normal; word-break: keep-all; }
}
/* 빈 장바구니 */
.cart_empty { display:none; text-align:center; padding: 90px 20px; }
.cart_empty .ic { font-size: 60px; line-height:1; margin-bottom: 20px; }
.cart_empty h3 { font-size: 24px; font-weight: 700; color:#333; }
.cart_empty p { margin-top: 10px; color:#777; font-size: 17px; }
.cart_empty .btn { margin-top: 26px; min-width: 220px; height: 60px; line-height: 58px; font-size: 19px; }
body.cart_is_empty .cart_notice,
body.cart_is_empty .cart_toolbar_row,
body.cart_is_empty .myli_view_mo,
body.cart_is_empty .mypage_contents,
body.cart_is_empty .cart_btnbox { display: none; }
body.cart_is_empty .cart_empty { display: block; }
/* ===== 일괄신청 결과 모달 ===== */
.cart_modal_dim { display:none; position:fixed; inset:0; background:rgba(20,30,45,.55); z-index:9999; }
.cart_modal_dim.on { display:block; }
.cart_modal {
position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
width: 92%; max-width: 520px; background:#fff; border-radius:14px; overflow:hidden;
box-shadow:0 20px 60px rgba(0,0,0,.3);
}
.cart_modal_head { padding: 26px 28px 6px; text-align:center; }
.cart_modal_head .rico { font-size:42px; line-height:1; }
.cart_modal_head h3 { margin-top:10px; font-size:23px; font-weight:800; color:#222; }
.cart_modal_head p { margin-top:6px; color:#666; font-size:15px; }
.cart_res_sum { display:flex; gap:12px; justify-content:center; padding:18px 28px; }
.cart_res_sum .chip { flex:1; max-width:170px; text-align:center; padding:14px; border-radius:10px; }
.cart_res_sum .chip .n { font-size:28px; font-weight:800; line-height:1; }
.cart_res_sum .chip .l { font-size:14px; font-weight:700; margin-top:6px; }
.cart_res_sum .ok { background:#e7f6ee; color:#1c7d55; }
.cart_res_sum .no { background:#fbece6; color:#D14905; }
.cart_res_list { max-height:210px; overflow-y:auto; border-top:1px solid #eee; }
.cart_res_list .r { display:flex; align-items:center; gap:10px; padding:13px 28px; border-bottom:1px solid #f0f0f0; font-size:15px; }
.cart_res_list .r .nm { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#333; }
.cart_res_list .r .st { font-size:13px; font-weight:700; white-space:nowrap; }
.cart_res_list .r.ok .st { color:#1c7d55; }
.cart_res_list .r.no .st { color:#D14905; }
.cart_modal_foot { display:flex; gap:10px; padding:18px 28px 24px; }
.cart_modal_foot .btn { flex:1; height:56px; line-height:54px; font-size:18px; }
/* ===== 일괄신청 모달 (동의 → 신청정보) : 실사이트 신청 팝업 구조 차용 ===== */
.cart_apply_modal { max-width: 640px; }
.cart_apply_modal .cart_modal_head { text-align:left; padding:24px 28px 12px; }
.cart_apply_modal .cart_modal_head h3 { font-size:21px; }
.apply_body { padding: 4px 28px 12px; max-height: 56vh; overflow-y:auto; text-align:left; }
.apply_sub { font-size:15px; font-weight:700; color:#333; margin:6px 0 8px; }
.cart_apply_modal .pop_agreement { max-height:200px; overflow-y:auto; border:1px solid #e2e2e2; border-radius:8px; padding:16px; background:#fafafa; font-size:13px; line-height:1.65; color:#555; }
.cart_apply_modal .pop_agreement .afree_con_tit { display:block; font-weight:800; color:#222; margin:12px 0 4px; }
.cart_apply_modal .pop_agreement .afree_con:first-child .afree_con_tit { margin-top:0; }
.cart_apply_modal .pop_agreement p { margin:6px 0; }
.cart_apply_modal .agree_line { margin-top:14px; }
.cart_apply_courses { background:#eef4fc; border:1px solid #dde9f6; border-radius:8px; padding:12px 16px; margin-bottom:16px; font-size:14px; color:#15589e; font-weight:700; }
.cart_apply_courses ul { margin-top:6px; }
.cart_apply_courses li { padding:2px 0 2px 12px; position:relative; color:#444; font-size:13.5px; font-weight:400; }
.cart_apply_courses li::before { content:"·"; position:absolute; left:2px; color:#15589e; }
.cart_apply_modal .popup_form table { width:100%; border-collapse:collapse; }
.cart_apply_modal .popup_form th { width:120px; text-align:left; padding:7px 10px 7px 0; font-weight:600; color:#444; font-size:14px; vertical-align:middle; }
.cart_apply_modal .popup_form td { padding:5px 0; }
.cart_apply_modal .popup_form .inp { width:100%; height:42px; border:1px solid #dcdcdc; border-radius:6px; padding:0 12px; font-size:14px; background:#f5f6f8; color:#444; }
.cart_apply_modal .popup_form .ready td { padding-top:10px; }