@charset "utf-8";

/* @import url("//fonts.googleapis.com/earlyaccess/notosanskr.css"); */
/* @import url("//fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@40,400,0,0"); */
/* @import url("//fonts.googleapis.com/css2?family=Material+Symbols+Outlined"); */

/*
 * [변경이력] 2026-02-20
 * 아래 @import를 incScriptSTUD.jsp의 <link> 태그로 이동 (캐시 버스팅 ?v=${v} 적용 + 병렬 로딩)
 *
 * @import url("../../common/css/material.css");
 * @import url("../../../font/fonts.css");
 * @import url("../../common/css/component.css");
 * @import url("../../common/css/common.css");
 * @import url("../../common/css/root.css");
 * @import url("../../common/css/layout.css");
 * @import url("../../common/css/contents.css");
 * @import url("../../common/css/chatbot.css");
 * @import url("../../common/css/fontawesome.css");
 * @import url("../../common/css/survey_tmpl.css");
 * @import url("../../common/css/survey.css");
 * @import url("../../STUD/css/classroom_student.css");
 */

:root {
	--padding-xxl : 5rem;
	--gap-xxl : 5rem;
}
/* 좌측 메뉴 스크롤 영역 */
.leftNav .nav_scroll {height: auto; min-height: calc(100vh - 80px - 170px);}
/* 언어 팝업 */
.settings_popup > ul > li > a { flex: 1 }
.settings_popup > ul > li.on > a { font-weight: var(--fw-bold); color: var(--color-primary) }
/* about */
.layout_center {max-width: 1200px;}
/* .layout_center  .leftNav {display: none;} */
.about {flex-direction: column; gap: 5rem; margin: var(--padding-xxl);}
.about_section {display: flex; flex-direction: column; gap: var(--gap-md);}
.about_title {font-size: var(--fs-lg); font-weight: var(--fw-semibold);}
.about_university {font-size: 40px; font-weight: var(--fw-semibold); line-height: 1.4;}
.about_welcome {font-size: var(--fs-lg); font-weight: var(--fw-semibold);}
.about_flex_row{display: flex; flex-direction: column; gap: 5rem;}
/* .about_flex_row > div {width: 50%;} */
.about_description {font-size: 17px;}
.about_description > p {margin: 2rem 0;}
.img_wrap {width: 100%;}
.img_wrap img {width: 100%;border-radius: 3rem; overflow: hidden; height: fit-content;}

@media (max-width: 768px) {
	:root {
	--padding-xxl : 1rem;
	}
	.about_flex_row{flex-direction: column; }
	.about_flex_row > div {width: 100%;}
}

/* BoD*/
.bod_list {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap-xl);}
.bod_list li{display: flex; flex-direction: column;justify-content: center;align-items: center;border: 1px solid var(--border);padding: var(--padding-lg);width: calc((100% - 6rem) / 4);border-radius: var(--radius-md);}
.bod_list li .bod_logo {text-align: center; margin-bottom:2rem;}
.bod_list li .bod_logo img{width: 60%;}
.bod_list li span{text-align: center; color: var(--text-black);}
.bod_list li span:last-child{color: var(--text-gray); font-size: 14px;}
.bod_img img{width: 100%;}

/* partners */
.partners { flex-direction: row; gap: 5rem; padding:var(--padding-xxl) 0 0; background: url(../../STUD/images/bg_partner.png) right bottom no-repeat;}
.logo_list{display: flex; flex-direction: column; gap: var(--gap-lg);}
.logo_list li{border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--padding-md); max-width: 335px; aspect-ratio: 10 / 3; display: flex;justify-content: center;align-items: center;}
.logo_list li img{max-width: 85%}
.country_list {width: 100%; column-count: 2;}
.country_group {margin-bottom:3rem;}
.country_group .title {font-size:var(--fs-lg); font-weight: var(--fw-bold); margin-bottom: 0.8rem;}

@media (max-width: 1024px) {
	.partners {flex-direction: column;}
	.partner_logo {flex-direction:row;}
	.logo_list {flex-direction: row;}
}
@media (max-width: 768px) {
	.country_list {column-count: 1;}
}

/* program introduce */
:root{
    --prog-badge-bg: #EBD2D3;
    --prog-badge-txt: var(--text-primary);
    --badge-cert : var(--color-secandary);
}
.prog_list li {counter-increment: prog;display: flex;padding: 28px 0;border-bottom: 1px dashed var(--border, #e5e5e5);position: relative;flex-direction: column;padding-left: 6rem;}
.prog_list li:last-child { border-bottom: 0; }    
.prog_list li::before {content: counter(prog);display: flex;place-items: center;width: 5rem;height: 5rem;border-radius: var(--radius-full);font-weight: var(--fw-semibold);background: var(--prog-badge-bg);color: var(--text-black);margin-top: 2px;align-items: center;justify-content: center;position: absolute;left: 0;font-size: var(--fs-lg);}
.prog_list .title {font-size: var(--fs-md);line-height: 1.35;color: var(--color-secandary);font-weight: var(--fw-semibold, 600);margin: 0 0 8px;}
.prog_list .prog_desc {font-size: var(--fs-base);color: var(--text-black);margin: 0;}

/* program apply */
/* .program_apply {padding:var(--padding-xxl) 0 0;} */
.prog_card {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap-xl);}
.prog_card li {width:calc((100% - 4rem) /3);}
.main .prog_card li {width:calc((100% - 6rem) /4);}

.prog_link{ position:relative; display:block; border-radius:14px; overflow:hidden; aspect-ratio: 4/3; box-shadow:0 4px 16px rgba(0,0,0,.08); outline:none; color:#fff;}
.prog_link:hover {color:#fff;}
.prog_media,.prog_img,.prog_tint{position:absolute; inset:0;}
.prog_img{ width:100%; height:100%; object-fit:cover; object-position:center; transform:scale(1.02); transition:transform .45s ease;}
.prog_tint{
    background:
        linear-gradient(to bottom, rgba(0,0,0,.0) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.45) 100%),
        hsl(var(--tint_hsl) / .42);
    mix-blend-mode: multiply;
}

/* title */
.prog_title{ position:absolute; left: 50%; top: 50%; bottom:18px; font-weight:700; font-size:clamp(16px, 1.5vw, 20px); line-height:1.25; text-shadow:0 1px 2px rgba(0,0,0,.35); transform: translate(-50%, -50%); display: flex; justify-content: center; align-content: center; align-items: center; width: 100%; height: 100%; text-align: center;}
/* .prog_link:hover .prog_title{opacity: 0;}
.prog_text{position: relative; background: #00000080; display: flex; height: 100%; align-items: center; justify-content: center; z-index: 10; top:0; padding:var(--padding-xl); opacity: 0; transition:opacity .2s ease;}
.prog_link:hover .prog_text {opacity:1; } */

/* arrow icon */
.prog_icon{
    position:absolute; top:10px; right:10px;
    display:grid; place-items:center;
    width:32px;height:32px;
    border-radius:8px;
    background:rgba(255,255,255,.18);
    backdrop-filter:saturate(120%) blur(2px);
    color:#fff;
    transition:transform .2s ease, background .2s ease;
}

/* interactions */
@media (hover:hover){
    .prog_link:hover .prog_img{transform: scale(1.5);}
    .prog_link:hover .prog_icon{ transform:translateY(-1px); background:rgba(255,255,255,.26);}
}
.prog_link:focus-visible{
    box-shadow:0 0 0 3px #fff, 0 0 0 6px #2f6af9;
}

/* tints (각 카드 색) */
.tint_coral { --tint_hsl: 8 80% 55%; }
.tint_teal  { --tint_hsl: 183 55% 40%; }
.tint_blue  { --tint_hsl: 210 70% 45%; }
.tint_navy  { --tint_hsl: 220 50% 25%; }
.tint_orange{ --tint_hsl: 30 85% 55%; }
.tint_sky   { --tint_hsl: 200 70% 55%; }
.tint_bronze{ --tint_hsl: 20 60% 40%; }
.tint_sunset{ --tint_hsl: 18 70% 52%; }

/* responsive */
@media (max-width: 1200px){
    .prog_grid{ grid-template-columns:repeat(3, minmax(200px,1fr)); }
}
@media (max-width: 900px){
    .prog_grid{ grid-template-columns:repeat(2, minmax(180px,1fr)); }
}
@media (max-width: 560px){
    .prog_grid{ grid-template-columns:1fr; }
    .prog_title{ right:46px; }
}

/* motion respect */
@media (prefers-reduced-motion: reduce){
    .prog_img,.prog_icon{ transition:none; }
}

@container (max-width: 1024px){
	.prog_card li, .main .prog_card li {width: calc((100% - var(--gap-xl)*2) / 3); }
}
@container (max-width: 768px) {
	.prog_card li, .main .prog_card li{width: calc((100% - var(--gap-xl)) / 2); }
}
@container (max-width: 560px) {
	.prog_card li, .main .prog_card li{width: 100%; }
}

/* participation in the lecture */
.attendance_section {gap:0; padding-bottom: 3rem;}
.attendance_section .progress_item {background: #f0f0f0; border:0; }
.attendance_section .progress {background: #d9d9d9; position: relative; overflow: visible;}
.attendance_labels{ display: flex; justify-content: space-between; margin-bottom: 0.8rem; padding: 0 0px 0 8px;}
.attendance_labels span { font-size: 1.2rem; color: #6b7280; position: relative;}
.attendance_labels span::before { content: ''; position: absolute; bottom: -0.8rem; left: 50%; transform: translateX(calc (-50% - 2px)); width: 1px; height: 0.6rem; background: #d1d5db;}
.attendance-threshold { font-size: var(--fs-sm); color: var(--system-color-red); white-space: nowrap; font-weight: 500; position: absolute; left: 75%; transform: translateX(calc(-50% - 2px)); top: -1.4rem; display: flex; flex-direction: column; align-items: center;}
.attendance-threshold:before {content:''; width:3px; height: 42px; background: var(--system-color-red);}
.absent .status {justify-content: center;}

/* 강의 목록 */
.thumbnail { width: 100%; flex-shrink: 0;}
.thumbnail_inner { background: #f7f8fa; border-radius: var(--radius-lg); overflow: hidden; position: relative; box-shadow: 0 2px 6px rgba(30,40,75,0.05);}
.thumbnail img { width: 100%; object-fit: cover;  display: block; aspect-ratio: 16/9}
.thumbnail .badge { position: absolute; top: 1rem; left: 1rem; background: var(--color-black); color:var(--text-invert); font-size: var(--fs-sm); padding:0.4rem 1rem; border-radius: var(--radius-sm); border:0;}
.thumbnail .ing { background: #00a85d; }
.thumbnail .end { background: #a0192f; }
.thumbnail .badge_cert { position: absolute; top: 1rem; right: 1rem; background: var(--badge-cert); color:var(--text-invert); font-size: var(--fs-sm);  padding:0.4rem 1rem; border-radius: var(--radius-sm); display: inline-flex;}

.program_list {padding: 0 0 var(--padding-xxl);}
.card_list {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap-lg);}
.card_list li{width: calc((100% - var(--gap-lg)*3) / 4); }
.card_list li > a{display: flex; gap: var(--gap-lg); flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--padding-lg);}
.card_content {display: flex; flex-direction: column;}
.card_content .title {font-size: var(--fs-md);font-weight: var(--fw-semibold);color: var(--text-black);padding-bottom: var(--padding-md);height: 60px;display: -webkit-box;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;line-height: 1.6;overflow: hidden;}
.card_content .name {font-size: var(--fs-sm); }

/* 카테고리 소개 */
.ctgry_intro {position: relative; display: flex; align-items: center; min-height: 24rem; margin-bottom: 1.2rem; border-radius: 14px; overflow: hidden; background: var(--color-secandary); color: var(--text-invert); box-shadow: 0 4px 16px rgba(0,0,0,.08);}
.ctgry_intro_img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}
.ctgry_intro_dim {position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.42) 50%, rgba(0,0,0,.12) 100%);}
.ctgry_intro_body {position: relative; z-index: 1; display: flex; flex-direction: column; gap: 1.6rem; max-width: 80rem; padding: 4rem 4.8rem;}
.ctgry_intro_title {font-size: clamp(2.4rem, 2.2vw, 3.2rem); font-weight: 800; line-height: 1.25; text-shadow: 0 1px 2px rgba(0,0,0,.35);}
.ctgry_intro_title::after {content: ''; display: block; width: 4.8rem; height: 4px; margin-top: 1.4rem; border-radius: var(--radius-full); background: hsl(var(--tint_hsl, 0 0% 100%));}
.ctgry_intro_desc.list_dot {padding: 0; font-size: var(--fs-md); line-height: 1.6;}
.ctgry_intro_desc.list_dot > li {padding: 0 0 0 1.8rem;}
.ctgry_intro_desc.list_dot > li + li {margin-top: .6rem;}
.ctgry_intro_desc.list_dot > li:before {left: 0; margin-left: 0; top: 1.2rem; background: var(--color-white);}
.ctgry_intro_desc.list_dot > li:empty {display: none;}
@container (max-width: 768px) {
	.ctgry_intro {min-height: 0;}
	.ctgry_intro_body {padding: 2.4rem 2rem;}
	.ctgry_intro_desc.list_dot {font-size: var(--fs-base);}
}

/* 강의 상세정보 */
.program_detail {gap: var(--gap-xxl); padding:var(--padding-xxl) 0 0;}
.program_detail .summary { display: flex; gap: 5rem; align-items: flex-start;}
.program_detail .summary .thumbnail { min-width: 190px; width: 45%; flex-shrink: 0;}
.program_detail .summary .title { font-size: 2.05rem; font-weight: 700; margin-bottom: 1.5rem; color: #1d2237;}
.program_info { display: flex; flex-direction: row; flex-wrap: wrap;}
.program_info dt{ width: 15%; border-bottom: 1px solid var(--border); padding: var(--padding-lg); font-size: var(--fs-sm); display: flex; align-items: center;}
.program_info dt .tooltip .icon{width:20px; height:20px; }
.program_info dt .tooltip .icon .material-symbols-outlined{width:20px; height:20px; font-size: 20px;}
.program_info dd{ width: 35%; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); padding: var(--padding-lg); color: var(--text-black); font-size: var(--fs-sm); font-weight: var(--fw-medium);}
.program_info dd:nth-of-type(2n){ border-right: 0;}

.btn_area.apply {margin-top:2rem; flex-wrap: nowrap;}
.btn_area.apply .btn_favorite, .btn_area.apply .btn_delete,
.btn_area.apply .btn_cart { border:1px solid var(--border); color:var(--text-black); width: 46px; max-height:46px; margin: 0;}
.btn_area.apply .btn_cart { margin-left: 0.5rem;}
.btn_favorite[aria-disabled="true"], .btn_cart[aria-disabled="true"] { opacity: 0.5; cursor: default; }
.btn.btn_secandary {background: var(--color-secandary);color:var(--text-invert);height: auto;border: 1px solid transparent;padding: var(--padding-lg);}
.icon_tooltip:before{font-size: 20px !important;width: 20px;height: 20px;margin-left: 8px;}

.program_detail .detail { flex: 1 1 0%; min-width: 0; display: flex; gap:var(--gap-xxl);}
.program_detail h4:before {display: none !important; }
.program_detail h4{margin-bottom:2rem;}
.program_detail h5 {display: flex; padding: 2rem 0 0;}
.program_detail h5:before {content:'\f88b';font-weight: 600;color: #785dc8;}
.program_detail .detail .detail_info{font-size: var(--fs-sm);}
.program_detail .detail_info dt {background: transparent; font-weight: var(--fw-normal); justify-content: flex-start;}
.program_detail .detail_info dd {font-weight: var(--fw-semibold)}
.program_detail .video_preview {height: auto;aspect-ratio: 16/9;max-width: 1000px;}
.program_detail .rule {border:1px solid var(--border); border-radius: var(--radius-md); padding:var(--padding-lg); font-size: var(--fs-sm);}
.program_detail .section_full { margin: 0 -3.6rem; border-top: 1px solid var(--border-dp); padding: var(--padding-content-wrap);}

@media (max-width: 1920px) {
	.card_list li{width: calc((100% - var(--gap-lg)*3) / 4); }
}
@container (max-width: 1024px) {
	.card_list li{width: calc((100% - var(--gap-lg)*2) / 3); }
}
@container (max-width: 768px) {
	.card_list li{width: calc((100% - var(--gap-lg)) / 2); }
}
@container (max-width: 560px) {
	.card_list li{width: 100%; }
	.popular_title {white-space: normal !important;}
	.main_content > section h3.title {white-space: normal;}
}
@media (max-width: 900px) {
    .program_detail .summary {
        flex-direction: column;
        gap: 1.8rem;
    }
    .program_detail .summary .thumbnail {
        max-width: 100%;
        width:100%;
        min-width: 0;
    }
    .program_info {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .program_detail {
        padding: 1.3rem 0.7rem;
    }
    .program_detail .summary {
        gap: 1rem;
    }
    .program_detail .thumbnail-img {
        height: 90px;
    }
    .detail-title {
        font-size: 1.35rem;
    }
    .program_info {
        font-size: 1rem;
    }
}

.program_info dd {
    margin-left: 0;
    margin-bottom: 0;
    font-weight: 400;
    display: flex;
    align-items: center;
}

.rate-stars { display: inline-block; width: 108px; height: 18px; background: url(../../common/images/common/img_star_rate_gray.png) no-repeat top left; vertical-align: middle; overflow: hidden;}
.rate-stars .star_rating{ display: inline-block; width: 108px; height: 18px; background: url(../../common/images/common/img_star_rate_color.png) no-repeat top left;}
.rate-value { color: var(--text-black); font-weight: var(--fw-semibold); display: inline-block; margin-left: var(--margin-md); vertical-align: middle;}

/* 퀵링크 */
.nav { border:1px solid var(--border); border-radius:var(--radius-md);position: sticky; top: 90px; background: #fff; z-index: 100;  /* overflow: hidden; */}
.nav > ul {flex-wrap: nowrap; display: flex;}
.nav > ul > li{min-width:17rem;}
.nav > ul > li a {border-right:0.1px solid var(--border); padding:var(--padding-lg); width:100%; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; justify-content: center;}
.nav > ul > li.active a{border:1px solid var(--color-primary); background: var(--color-primary);color:var(--text-invert);}

.program_detail .blockRight {max-width:40rem; flex:0 0 40rem;} /* Safari: 우측 정보패널 압축 방지(영상이 좌측을 안 줄여도 우측 폭 보장) */
.program_detail .info {}

@container (max-width: 1024px) {
	.program_detail .section_full{margin: 0 -1.9rem;}
}

@container (max-width: 768px) {
	.program_detail .detail{flex-direction: column;}
	.program_detail .blockRight {max-width: 100%; flex:0 1 auto;} /* 1단 전환 시 우측 고정 해제 */
}

@container (max-width: 560px) {
	.program_info dt{width: 25%; border-right: 1px solid var(--border);}
	.program_info dd{width: 75%; border-right: 0;}
}

/* 마이페이지 */
/* Course enrollment status */
.course_enrollment .card {flex-direction: row;justify-content: space-between;padding: var(--padding-lg);align-items: center;}
.course_enrollment .card .progress_item { max-width: 40%; flex-grow: 1; border:0; padding: 0; gap: var(--gap-lg);}
.course_enrollment .card .progress_item .label {display: flex;}
.course_enrollment .card .progress_item .label li {border-radius: var(--radius-full); padding:var(--padding-sm) var(--padding-xl);}
.course_enrollment .card .progress_item .label .school_info{border:1px solid var(--border); }
.course_enrollment .card .progress_item .label .course_info.c01{background: #daf2f1;}
.course_enrollment .card .progress_item .label .course_info.c02{background: #f3e6e0;}
.course_enrollment .card .progress_item .subject {display: flex; font-size: 23px; font-weight: var(--fw-bold);}
.course_enrollment .card .progress_item .progress {width: calc(100% - 6rem);}
.course_enrollment .card .progress_item .value {font-size: 20px; margin-top: -3.2rem; margin-bottom: 1rem;}
.course_enrollment .card .course_item { width: 40%; max-width: 40%; flex-grow: 1; flex-shrink: 0; border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--padding-xl);}
.course_enrollment .card .course_item .title { font-weight: var(--fw-bold); display: flex; flex-direction: column; flex-grow: 1; color: var(--text-black);}
.course_enrollment .card .course_item .title span {font-weight: var(--fw-normal); color: var(--text-gray); display: flex; gap: var(--gap-md);}
.course_enrollment .card .course_item .title ul {display: flex; gap:var(--gap-md);}
.course_enrollment .card .course_item .title li {font-weight: var(--fw-normal);color: var(--text-gray);font-size:var(--fs-sm);position: relative;padding-right: 1rem;white-space: nowrap;flex-grow: 0;flex-basis: content;}
.course_enrollment .card .course_item .title li:after {content: '';position: absolute;width: 1px;height: 12px;background: var(--border);margin-left: 1rem;top: 6px;}
.course_enrollment .card .course_item .title li:last-child::after {display: none;}
.course_enrollment .card .course_item em{color: var(--text-black);}
.course_enrollment .card .course_item .btn_primary {width: 15rem; flex-shrink: 0; white-space: nowrap;}
.course_enrollment .card .course_item .course_action {display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; gap: 0.6rem;}
.course_enrollment .card .course_item .course_cancel {padding: 0.2rem 0.4rem; border: 0; background: transparent; color: var(--text-gray); font-size: 1.3rem; text-decoration: underline; cursor: pointer;}
.course_enrollment .card .status_complate:after {color: var(--system-color-green); display: inline-flex; margin-left: 1rem;}
@container (max-width: 1280px) {
	.course_enrollment .card .progress_item { max-width: none;}
}
@container (max-width: 860px) {
	.course_enrollment .card {flex-direction:column;}
	.course_enrollment .card .progress_item .label, .course_enrollment .progress_item .label ul {flex-direction: column;}
	.course_enrollment .card .progress_item, .course_enrollment .card .course_item {width: 100%; max-width: none; flex-direction: column;}
    .course_enrollment .card .course_item {gap:var(--gap-md);}
	.course_enrollment .card .course_item .title { width: 100%;}
}

/* 위시리스트 */
.wishlist_list .tab_face div.current{gap:0;}
.wishlist_list_desc{padding: var(--padding-lg) var(--padding-xl);background: #e6e9f6;}
.wishlist_list_item{display:flex; flex-direction:column;}

.course_card{display:flex; align-items:stretch; gap: var(--gap-lg); border-bottom:1px solid var(--border); padding:var(--padding-xl); position:relative;}
.course_card_link{display:flex; flex:1; gap:1.6rem; min-width:0;}
.course_card_thumb{width:132px; flex:0 0 132px; aspect-ratio: 16 / 9; border-radius:var(--radius-md); overflow:hidden; margin:0;}
.course_card_thumb img{width:100%; height:100%; object-fit:cover;}

.course_card_body{display:flex; flex-direction:row; flex-wrap: wrap; gap:var(--gap-sm) var(--gap-xl) ; flex:1; align-items: center; min-width:0; justify-content: space-around;}
.course_card_body .course_info {/* margin-top: -2.5rem; */ width: 100%;}
.breadcrumb_list{display:flex; gap:.6rem; color:var(--text-gray); font-size:var(--fs-sm);}
.breadcrumb_item+.breadcrumb_item::before{content:"›"; margin:0 .4rem 0 0; color:var(--text-gray);}
.course_title{font-size: var(--fs-md); color:var(--text-black); word-break:keep-all;}
.course_meta{display:flex; gap: var(--gap-xl);; color:var(--text-gray); font-size:var(--fs-sm);}
.course_meta_org {color:var(--text-black); font-weight: var(--fw-bold); position: relative;}
.course_meta_org:after {content: '';position: absolute;width: 1px;height: 12px;background: var(--border);margin-left: 1rem;top: 6px;}
.course_period{font-size:var(--fs-sm); color:var(--text-black);}

.course_badges{display:flex; gap:.6rem; margin-bottom:.4rem;}
.badge{
    display:inline-flex; align-items:center; padding:.2rem .8rem;
    border-radius:var(--radius-sm); font-size:var(--fs-sm);
    border:1px solid var(--border); background:var(--color-white);
}
.badge_status{background:var(--color-black); color:var(--text-invert) !important; border-color:var(--color-black);}

.badge_open{background:var(--color-primary); color:var(--text-invert); border-color:var(--color-primary);}
.badge_cert{background:#a0192f; color:var(--text-invert) !important; border-color:#a0192f;}
.badge_cert:before{font-size: 20px;}

.course_info .badge_status .badge {color:var(--text-invert) !important;}

.course_card_actions{display:flex; align-items:center; margin-left:auto;}
.btn{display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 16px; border-radius:var(--radius-sm); font-size:var(--fs-base); cursor:pointer;}
.btn_ghost{background:var(--color-white); border:1px solid var(--border);}
.btn_ghost:hover{border-color:var(--color-primary); color:var(--color-primary);}

/* 구분선(목록 아이템 사이 박스 쉐도 or 보더 라인 유지용) */
.wishlist_item + .wishlist_item .course_card{border-top-left-radius:0; border-top-right-radius:0;}
.wishlist_item + .wishlist_item{border-top:1px solid var(--border-weak);}

/* 장바구니 */
.shopping_cart {}
.shopping_cart .btn_area.apply {gap:var(--gap-sm); margin-top:0}
.shopping_cart .btn_area.apply .btn_favorite, .shopping_cart .btn_area.apply .btn_delete, .shopping_cart .btn_area.apply .btn_cart {width:36px; max-height: 36px; padding: 0;}
.shopping_cart .cart_contents{display:grid; grid-template-columns:minmax(0, 1fr) 280px; gap:var(--gap-lg); align-items:start;}
.shopping_cart .cart_list_area{min-width:0;}
.shopping_cart .cart_list_area .pannel{padding:0;}
.shopping_cart .cart_list_area .pannel .btn_area.top {padding: var(--padding-md);border-bottom: 1px solid var(--border);width: 100%;gap: var(--gap-lg);}
.shopping_cart .cart_list_area .course_card label {align-items: flex-start;}
.shopping_cart .cart_list_area .course_card_thumb { aspect-ratio: 4 / 3; height: fit-content;}
.shopping_cart .payment_summary{position:sticky; top:100px; padding:var(--padding-xl); border:1px solid var(--border); border-radius:var(--radius-md); background:var(--color-white);}
.shopping_cart .payment_summary_title{margin:0 0 16px; padding:0; font-size:var(--fs-lg); font-weight:700;}
.shopping_cart .payment_summary_list{display:flex; flex-direction:column; gap:12px; margin:0 0 20px;}
.shopping_cart .payment_summary_row{display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:var(--fs-base);}
.shopping_cart .payment_summary_row dt{color:var(--text-muted);}
.shopping_cart .payment_summary_row dd{margin:0; font-weight:600;}
.shopping_cart .payment_summary_row .totalPrice, .shopping_cart .original_price {text-decoration: line-through; font-weight: 400;}
.shopping_cart .payment_summary_row .discountPrice, .shopping_cart .discount_rate {color:var(--system-color-red);}
.shopping_cart .payment_summary_row.total{margin-top:8px; padding-top:16px; border-top:1px solid var(--border-weak); font-weight:700;}
.shopping_cart .payment_summary_row.total dt, .shopping_cart .payment_summary_row.total dd{color:var(--color-black); font-size:var(--fs-lg);}
.shopping_cart .payment_summary .btn_primary{width:100%; font-size: var(--fs-lg); font-weight: var(--fw-semibold);}
.shopping_cart .card_add_form .btn_area{margin-top:var(--gap-lg);}
.shopping_cart .card_no_group{display:flex; gap:var(--gap-sm); align-items:center;}
.shopping_cart .card_no_group input{flex:1; min-width:0; text-align:center;}
.shopping_cart .badge_status, .shopping_cart .course_price_label{display: none;}
.shopping_cart .course_price_value {display: flex; gap: var(--gap-md);}
.course_price_info {width: 100%;}
.original_price {font-size: var(--fs-sm); color:var(--text-gray); }
.shopping_cart .wishlist_item:last-child .course_card{border-bottom:0;}

/* 결제 */
.payment.pannel{padding: var(--padding-xl) !important; margin-top:1.2rem;}
.payment .agree {display: flex; gap:var(--gap-md); flex-direction: column; margin-bottom: var(--margin-xl);}
.payment .agree dl {display: flex; justify-content: space-between;}
.payment .chk_list.card_payment{display:flex; flex-direction:column; align-items:flex-start; gap:8px;}
..payment .chk_list.card_payment label{display:inline-flex; align-items:center; font-weight:700;}
.payment .card_payment_select{display:flex; gap:8px; padding-left:32px;}
.payment .card_payment_select select{height:30px; min-width:118px; padding:0 32px 0 12px; border:1px solid var(--border); border-radius:var(--radius-sm); background-color:var(--color-white);}
.payment .card_payment_select select:first-child{min-width:220px;}


/* 반응형 */
@container (max-width: 1280px){
    .course_card_body{justify-content: normal}
}
@container (max-width: 960px){
    .course_card{padding:1.2rem;}
    .course_card_thumb{width:96px; height:96px; flex-basis:96px;}
    .course_card_body{justify-content: flex-start;display: flex;flex-direction: column;align-items: flex-start;gap: 0;}
    .course_card_body .course_info{margin-top:0;}
    .breadcrumb_item{flex:none !important;}
    .course_card_actions{position:absolute; right:1.2rem; bottom:1.2rem;}
}
@media (max-width: 768px){
	.course_card {flex-direction: column;}
	.course_card_actions{position:relative; right:1.2rem; bottom:1.2rem;}
    .shopping_cart .cart_contents{grid-template-columns:1fr;}
    .shopping_cart .payment_summary{position:static;}
}