@charset "utf-8";

/* 회원가입 완료 페이지 */
.join-comp-tb .li_01 {flex:40 1 0;}
.join-comp-tb .li_02 {text-align:center; justify-content:center; flex:60 1 0;}
.join-comp-btn {margin-top:20px; width:100%; display:flex; align-items:stretch; justify-content:center; gap:20px;}
.join-comp-btn button {padding:8px 20px; font-size:18px; color:#fff; border-radius:1000px; cursor:pointer;}
.join-comp-btn .open-layer-btn {background:#f94c85;}
.join-comp-btn .login-btn {background:var(--color-primary);}



/* 로그인페이지 데코 */
.login-deco-box {display:flex; align-items:center; justify-content:center; gap:20px;}
.login-deco-box p {font-size:24px; font-weight:600; line-height:150%; color:var(--color-primary); text-align:left;}
.login-deco-box img {max-width:200px;}
@media (max-width:640px){
	.login-deco-box {flex-direction:column; margin-bottom:20px;}
	.login-deco-box p {font-size:21px; text-align:center;}
	.login-deco-box img {max-width:180px;}
}




/* 교육원 소개 페이지 */
.intro_area {padding:20px 0;}
.intro_area .section {padding:80px 40px;}
.intro_area .section .content-box {max-width:1200px; margin:0 auto;}
.parallax-wrap {position:relative; height:300px; overflow:hidden; z-index:1;}
.parallax-wrap .parallax-bg {position:absolute; top:0; left:0; width:100%; height:100%; background:url("/") no-repeat center/cover; z-index:0;}
.parallax-wrap .parallax-bg::after {content:""; position:absolute; inset:0; background:rgba(0, 0, 0, 0.4);}
@media (max-width:768px) {
	.intro_area .section {padding:40px 20px;}
	.parallax-wrap {height:200px;}
}

.main-intro {position:relative; background:#d9e7fa; padding-top:100px; z-index:2;}
.main-intro .headline-box {position:absolute; top:-80px; left:50%; transform:translateX(-50%); padding:30px 20px; width:calc(100% - 240px); 
	background:#ffffff; border-top:3px solid #446cf9; border-bottom:3px solid #446cf9; text-align:center; box-shadow:0 6px 20px rgba(0, 0, 0, 0.15); z-index:5;}
.main-intro .headline-box .banner-subtitle {color:#446cf9; font-size:24px; font-weight:600; line-height:120%; margin-bottom:10px;}
.main-intro .headline-box .banner-title {font-size:48px; font-weight:800; line-height:120%; color:#1d1d1d;}
.main-intro .content-box {max-width:1200px; display:flex; gap:20px; align-items:center; justify-content:space-between; padding:20px 100px 40px 100px; margin:0 auto; flex-flow:row nowrap;}
.main-intro .content-box .intro-text {flex:1 1 500px;}
.main-intro .content-box .intro-text .section-title {font-size:21px; font-weight:700; line-height:120%; color:#446cf9; margin-bottom:20px; text-align:left;}
.main-intro .content-box .intro-text .section-desc {font-size:16px; line-height:150%;}
.main-intro .content-box .intro-img {flex:1 1 280px;}
.main-intro .content-box .intro-img img {max-width:100%; height:auto;}
@media (max-width:768px) {
	.main-intro .headline-box {width:calc(100% - 80px);}
	.main-intro .headline-box .banner-subtitle {font-size:18px;}
	.main-intro .headline-box .banner-title {font-size:34px;}
	.main-intro .content-box {padding:20px; flex-flow:column nowrap;}
	.main-intro .content-box > .intro-text {flex:1 1 auto; text-align:center;}
	.main-intro .content-box > .intro-text > .section-title {text-align:center;}
	.main-intro .content-box > .intro-img {flex:1 1 auto; max-width:200px;}
}

.section-head {text-align:center; margin-bottom:40px;}
.section-head .section-title {font-size:34px; font-weight:700; line-height:120%;}
.section-head .section-subtitle {font-size:15px; line-height:150%; color:#777777; margin-top:12px;}
@media (max-width:768px) {
	.section-head .section-title {font-size:28px;}
	.section-head .section-desc {font-size:15px;}
}

.purpose {text-align:center;}
.purpose .steps {max-width:1000px; margin:0 auto; display:flex; flex-direction:column; gap:40px;}
.purpose .steps .step {position:relative; background:#f7f7f7; padding:60px 20px 40px 20px; border-radius:12px; text-align:center;}
.purpose .steps .step .step-label {position:absolute; top:0; left:50%; transform:translate(-50%, -15px); 
	display:inline-block; background-color:#446cf9; color:#ffffff; font-size:16px; font-weight:600; padding:8px 30px; border-radius:999px;}
.purpose .steps .step .step-title {font-size:21px; font-weight:700; line-height:120%; color:#446cf9; margin-bottom:14px;}
.purpose .steps .step .step-desc {font-size:16px; line-height:150%;}
@media (max-width:768px) {
	.purpose .steps .step .step-title {font-size:18px;}
}

.principle {background:#446cf9; color:#ffffff; text-align:center;}
.principle .section-head .section-subtitle {color:#ffffff;}
.principle .principle-list {display:flex; justify-content:center; flex-wrap:wrap; gap:24px; max-width:1200px; margin:0 auto;}
.principle .principle-list .item {background:#ffffff; flex:1 1 30%; padding:20px; border-radius:10px; box-sizing:border-box; text-align:center;}
.principle .principle-list .item img {width:60%; margin-bottom:16px;}
.principle .principle-list .item .item-title {font-size:21px; font-weight:700; line-height:120%; color:#446cf9; margin-bottom:16px;}
.principle .principle-list .item .item-desc {font-size:16px; line-height:150%; color:#1d1d1d;}
@media (max-width:768px) {
	.principle {padding:40px 20px;}
	.principle .principle-list {flex-direction:column; align-items:center;}
	.principle .principle-list .item {flex:1 1 auto; width:100%; max-width:400px;}
	.principle .principle-list .item img {width:80%;}
	.principle .principle-list .item .item-title {font-size:18px;}
}








/* 서브페이지 공통 요소 */
input[type=checkbox].award_check {width:16px; height:16px; accent-color:var(--color-primary); cursor:pointer;}
.content_area {position:relative; margin:0 auto; margin-bottom:40px; padding:0; width:100%; display:flex; flex-flow:column nowrap; gap:20px;}
.content_title {font-size:18px; font-weight:600;}
.content_title span {color:var(--color-primary); font-size:21px;}
.award_subtitle {font-size:16px; color:var(--color-primary);}
.award_title_flex {display:flex; align-items:end; justify-content:space-between;}
.award_btn {display:flex; align-items:center; justify-content:center;}
.award_btn button {align-self:center;}
/* 가로 기본 테이블 */
.row_tb {width:100%; overflow:hidden; border-top:1px solid var(--color-text-base); box-sizing:border-box;}
.row_tb > ul {display:flex; align-items:stretch; justify-content:flex-start; gap:0;}
.row_tb > ul.head {background:var(--color-border-light);}
.row_tb > ul.head > li {color:var(--color-text-base); font-weight:600;}
.row_tb > ul > li {padding:20px 8px; display:flex; align-items:center; justify-content:center; min-width:0; border-bottom:1px solid var(--color-border);
					text-align:center; vertical-align:middle; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box;}
.row_tb > ul.total li {width:100%; color:var(--color-text-base); font-weight:600; box-sizing:border-box;}
.row_tb > ul.total2 li {background:var(--color-white); color:var(--color-text-base); font-weight:normal;}
.row_tb > ul.total2 li p {margin-left:8px;}
/*가로 색깔 테이블 */
.award_tb {width:100%; overflow:hidden; border-left:1px solid var(--color-border); border-top:1px solid var(--color-primary); box-sizing:border-box;}
.award_tb > ul {display:flex; align-items:stretch; justify-content:flex-start; gap:0;}
.award_tb > ul.head {background:var(--color-primary-bglight);}
.award_tb > ul.head > li {color:var(--color-primary); font-weight:600;}
.award_tb > ul > li {padding:16px 8px; display:flex; align-items:center; justify-content:center; min-width:0; border-bottom:1px solid var(--color-border); border-right:1px solid var(--color-border); 
					text-align:center; vertical-align:middle; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; box-sizing:border-box;}
.award_tb > ul.total li {width:100%; color:var(--color-primary-dark); font-weight:600; box-sizing:border-box;}
.award_tb > ul.total2 li {background:var(--color-white); color:var(--color-text-base); font-weight:normal;}
.award_tb > ul.total2 li p {margin-left:8px;}
/*세로 리스트*/
.column_list { width:100%; box-sizing:border-box; overflow:hidden; border-top:1px solid var(--color-border);}
.column_list > li {padding:16px; border-bottom:1px solid var(--color-border);}
/* 세로 공통 테이블 */
.column_tb {display:flex; flex-direction:column; width:100%; overflow:hidden; border-left:1px solid var(--color-border); border-top:1px solid var(--color-primary); box-sizing:border-box;}
.column_tb ul {display:flex; align-items:stretch;}
.column_tb ul li {display:flex; align-self:stretch; align-items:center; min-width:0; padding:16px; border-right:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
.column_tb ul li.head {justify-content:center; background:var(--color-primary-bglight);}
/* 탭메뉴 */
.tab-menu {width:100%; display:flex; flex-flow:row nowrap; align-items:stretch; justify-content:center; gap:8px; text-align:center;}
.tab-menu li {padding:16px 20px; display:flex; align-items:center; justify-content:center; flex:1; background:var(--color-border-light); border-radius:1000px; font-size:18px; cursor:pointer;}
.tab-menu li.active {background:var(--color-text-base-light); color:#fff;}
.tab-menu li:hover {background:var(--color-text-base); color:#fff;}


@media (max-width:640px){
	.content_title {font-size:16px;}
	.content_title span {font-size:18px;}
	.award_tb > ul > li {padding:8px; font-size:14px;}
	.award_tb > ul.total2 li {display:flex; flex-direction:column;}
	.award_tb > ul.total2 li p {margin:4px 0 0;}

	.column_list > li {padding:16px 0;}
	.column_tb ul li {padding:8px; font-size:14px;}

	.tab-menu li {padding:16px 8px; font-size:16px;}
}





/* 자격증 발급 안내 페이지 */
.issuance_visual_area img {border-radius:16px; width:100%;}
.issuance_step_area {padding:30px; border-radius:16px; background:var(--color-primary-bglight);}
.issuance_step_area img {width:100%;}
.issuance_tb_01 .column_list01 {width:30%;}
.issuance_tb_01 .column_list02 {width:70%;}
.issuance_tb_02 .li_01 {width:30%;}
.issuance_tb_02 .li_02 {width:40%;}
.issuance_tb_02 .li_03 {width:30%;}
@media (max-width:640px){
	.issuance_visual_area img {border-radius:8px;}
	.issuance_step_area {padding:16px; border-radius:8px;}
}


/* 시험 합격 페이지 */
.congrate-area {background:var(--color-secondary-bglight);}
.congrate-area .congrate-box {padding-bottom:40px; width:100%; display:flex; flex-direction:column; align-items:center; gap:20px; text-align:center;}
.congrate-area .congrate-box img {width:100%; max-width:520px;}
.congrate-area .congrate-box p {font-size:18px; line-height:150%;}
.congrate-area .congrate-box a {background:var(--color-accent); color:#fff;}
.congrate-area .congrate-box a:hover, .congrate-area .congrate-box a:focus {background:var(--color-accent-dark); text-decoration:none;}
@media (max-width:640px){
	.congrate-area .congrate-box p {font-size:16px;}
}


/* 이벤트 페이지 */
.event-list-area {display:flex; flex-direction:column; gap:16px; background:#fff; box-sizing:border-box; min-width:0;}
.event-list-thumb {position:relative; overflow:hidden; border-radius:8px; background:#f6f7f9; aspect-ratio:390/200;}
.event-list-thumb img {width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease;}
.event-list-area:hover .event-list-thumb img {transform:scale(1.05);}
.event-list-area .event-list-info {display:flex; flex-direction:column; gap:16px;}
.event-list-info .event-list-title  {display:flex; flex-flow:column nowrap; gap:8px; min-width:0; align-items:start;}
.event-list-info .event-list-title span {padding:2px 4px; font-size:13px; border-radius:4px; border:1px solid var(--color-primary); color:var(--color-primary);}
.event-list-info .event-list-title h3 {display:block; min-width:0; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; 
												font-size:18px; font-weight:600; color:var(--color-text-base); line-height:130%;}
.event-list-info .event-list-title p {display:block; min-width:0; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px;}
.event-list-date {padding-top:16px; display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid var(--color-border);}
.event-list-date span {min-width:0; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; color:var(--color-text-sub);}
.event-list-date button {padding:4px; width:26px; height:26px; border-radius:1000px;}



/* 완성 패키지 */
.package-card {margin-bottom:40px; padding:40px; display:flex; flex-direction:column; background:var(--color-accent-bglight); border-radius:20px; border:2px solid var(--color-accent); box-sizing:border-box;}
.package-card .package-info {display:flex; flex-flow:row wrap; align-items:end; justify-content:space-between; min-width:0; gap:20px;}
.package-card .package-info > div {flex:1; display:flex; flex-direction:column; align-items:start; gap:16px;}
.package-card .package-info > div .sale {padding:8px 12px; font-size:18px; font-weight:600; color:var(--color-white); background:var(--color-red); border-radius:1000px;}
.package-card .package-info > div h6 {font-size:48px;}
.package-card .package-info > div p {font-size:18px; color:var(--color-accent-dark);}
.package-card .package-info > ul {margin-left:auto; display:flex; flex-direction:column; gap:8px; text-align:right;}
.package-card .package-info > ul li:first-child {color:var(--color-text-sub);}
.package-card .package-info > ul li:first-child > span {text-decoration:line-through;}
.package-card .package-info > ul li.pay {font-size:48px; font-weight:800; color:var(--color-accent);}
.package-card .package-info > button {width:100%; padding:20px; font-size:21px; font-weight:600; color:var(--color-white); background:var(--color-accent); border-radius:8px; box-sizing:border-box;}
.package-card .package-info > button:hover {background:var(--color-accent-dark);}
.package-card > button {margin-top:20px; display:flex; align-items:center; justify-content:center; gap:8px; font-size:16px; color:var(--color-text-sub);}
.package-card button i {transition:transform 0.3s;}
.package-card.current button i {transform:rotate(180deg);}
/* 구성과목 */
.package-card .package-detail {display:flex; align-items:stretch; justify-content:center; flex-flow:row wrap; gap:20px; min-width:0; background:var(--color-white); border-radius:20px;
											margin-top:0; padding:0; overflow:hidden; max-height:0; opacity:0; transition:all 0.5s ease-in-out;}
.package-card.current .package-detail {margin-top:20px; padding:20px; opacity:1; max-height:100%;}
.package-card .package-detail li {position:relative; margin:0 20px; padding:16px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; 
												text-align:center; border-radius:8px; background:var(--color-border-light);}
.package-card .package-detail li:not(:last-child)::after {content:"\f055"; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; top:50%; right:-15%; transform:translate(50%, -50%); 
																			font-size:30px; color:var(--color-accent); background:var(--color-white); border-radius:50%; z-index:1;}
.package-card .package-detail li div {width:160px; overflow:hidden; aspect-ratio:9 / 10; border-radius:8px; flex-shrink:0;}
.package-card .package-detail li div img {width:100%; height:100%; object-fit:cover;}
.package-card .package-detail li p {font-size:16px; font-weight:600;}
.package-card .package-detail li a {padding:8px; width:100%; color:var(--color-white); background:var(--color-accent); border-radius:8px; box-sizing:border-box;}
.package-card .package-detail li a:hover {background:var(--color-accent-dark);}
/* 패키지 없을시 */
.package-card.none_result {padding:80px 40px; background:var(--color-border-light); border:2px solid var(--color-border); font-size:21px; color:var(--color-text-sub);}
@media (max-width:640px){
	.package-card {padding:20px;}
	.package-card .package-info {flex-flow:column wrap; align-items:center;}
	.package-card .package-info > div {align-items:center; text-align:center;}
	.package-card .package-info > div .sale {font-size:16px;}
	.package-card .package-info > div h6 {font-size:40px;}
	.package-card .package-info > div p {font-size:15px;}
	.package-card .package-info > ul {margin-left:0; align-items:center; gap:4px; text-align:center;}
	.package-card .package-info > ul li.pay {font-size:40px;}
	.package-card .package-detail {flex-direction:column;}
	.package-card.current .package-detail {max-height:800px;}
	.package-card .package-detail li {margin:20px 0;}
	.package-card .package-detail li:first-child {margin-top:0;}
	.package-card .package-detail li:last-child {margin-bottom:0;}
	.package-card .package-detail li div {display:none;}
	.package-card .package-detail li:not(:last-child)::after {top:auto; bottom:-30%; right:auto; left:50%; transform:translate(-50%, 50%);}
}







/* 강의 리스트 페이지 */
/* 인기 추천순 */
.lectlist-select-box {display:flex; align-items:start;}
.lectlist-select-box ul {margin-left:auto; display:flex; gap:8px;}
.lectlist-select-box ul button {padding:4px 8px; font-size:15px; color:var(--color-text-sub); border:1px solid var(--color-text-sub-light); border-radius:1000px;}
.lectlist-select-box ul button:hover, .lectlist-select-box ul button.select {color:var(--color-secondary); border:1px solid var(--color-secondary);}
/* 리스트 */
.courselist {width:100%; display:flex; flex-wrap:wrap; align-items:center; gap:20px;}
.courselist > li {flex:0 0 calc(25% - 15px); box-sizing:border-box; min-width:0; margin-bottom:20px;}
.courselist > li > a.courselist_area .courselist_info_listbox {padding:16px 0; border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
.courselist > li.list_none {flex:100 1 0; text-align:center;}
.courselist_area {display:flex; flex-direction:column; gap:16px; background:#fff; box-sizing:border-box; min-width:0;}
.courselist_thumb {position:relative; overflow:hidden; border-radius:8px; background:#f6f7f9; aspect-ratio:9 / 10; object-fit:cover;}
.courselist_thumb img {width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease;}
.courselist_area:hover .courselist_thumb img {transform:scale(1.05);}
.courselist_area:hover .courselist_title h3 {color:var(--color-primary);}
/* 정보 영역 */
.courselist_info_area {display:flex; flex-direction:column; gap:16px;}
.courselist_title {display:flex; flex-flow:column nowrap; gap:8px; min-width:0; align-items:start;}
.courselist_title h3 {display:block; min-width:0; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; 
						font-size:18px; font-weight:600; color:var(--color-text-base); line-height:130%;}
/* 요약 리스트 */
.courselist_info_list {padding-top:16px; border-top:1px solid var(--color-border);}
.courselist_info_listbox {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.courselist_info_listbox li {display:flex; align-items:center; gap:8px; font-size:14px; min-width:0;}
.courselist_info_listbox li .tit {font-size:16px; color:var(--color-primary);}
.courselist_info_listbox li .con {display:inline-flex; align-items:center; gap:8px;}
.courselist_info_listbox li .con .prev-price {color:var(--color-text-sub-light); text-decoration:line-through;}
.courselist_info_listbox li .con .price {font-size:18px;}
@media (max-width:640px){
	.courselist_info_listbox li .tit {font-size:14px;}
}
/* 버튼 영역 */
.courselist_btnarea {display:flex; gap:8px;}
.courselist_btnarea button {padding:8px; border-radius:8px; font-size:16px; cursor:pointer; box-sizing:border-box; transition:all .2s;}
.courselist_btnarea .preview_btn {flex:1 1 50%;}
.courselist_btnarea .more_btn {flex:1 1 50%;}
@media (max-width:640px){
	.courselist_info_area {margin-bottom:0;}
	.courselist {gap:20px;}
    .courselist > li {flex:0 1 calc(50% - 10px);}
	.courselist_title h3 {font-size:16px;}
	.courselist_btnarea {flex-flow:column nowrap;}
}




/* 과정소개 구버전 */
.course_card {position:relative; display:flex; gap:40px; align-items:flex-start;}
.course_thumb {flex:0 0 390px; aspect-ratio:390/200; overflow:hidden; border-radius:8px; background:#f6f7f9;}
.course_thumb img {width:100%; height:100%; object-fit:cover; display:block;}
/* 버튼 */
.course_btn_area {position:absolute; top:220px; left:0; width:390px; display:flex; flex-direction:column; gap:16px; box-sizing:border-box;}
.course_btn_area button {display:flex; align-items:center; justify-content:center; gap:8px; font-weight:600; border-radius:4px; box-sizing:border-box; transition:all .2s ease;}
.course_btn_area button i {font-size:16px;}
.course_btn_area .btn_bottom_wrap {display:flex; gap:16px; order:2;}
.course_btn_area .btn_bottom_wrap button {flex:1; font-size:16px;}
.course_btn_area .btn_bottom_wrap button i {color:var(--color-primary);}
.course_btn_area .btn_bottom_wrap .preview {padding:16px 8px; border:1px solid var(--color-primary-lighter); color:var(--color-primary-dark);}
.course_btn_area .btn_bottom_wrap .preview:hover {background:var(--color-primary-bglight);}
.course_btn_area .btn_bottom_wrap .interest {padding:16px 8px; border:1px solid var(--color-primary-lighter); background:var(--color-primary-bglight); color:var(--color-primary-dark);}
.course_btn_area .btn_bottom_wrap .interest:hover {background:var(--color-primary-lighter);}
.course_btn_area .application {padding:16px; width:100%; order:1; font-size:21px; background:var(--color-primary); color:var(--color-white);}
.course_btn_area .application.delete {background:var(--color-text-sub);}
.course_btn_area .application.delete:hover {background:var(--color-text-sub);}
.course_btn_area .application:hover {background:var(--color-primary-dark);}
.course_btn_area .application i {font-size:21px;}
/* 정보 영역 */
.course_info_area {display:flex; flex-flow:column nowrap; gap:16px; flex:1;}
.course_title {display:flex; flex-flow:column nowrap; gap:8px; align-items:start;}
.course_regno {padding:0; background:none; font-size:14px; color:var(--color-text-sub);}
.course_title h3 {font-size:24px;}
/* 리스트 박스 */
.course_info_listbox {padding:16px; display:flex; flex-wrap:wrap; column-gap:16px; row-gap:16px; background:var(--color-primary-bglight); border-radius:8px;}
.course_info_listbox li {display:flex; align-items:center; gap:16px; flex:0 0 calc(50% - 8px); font-size:15px;}
.course_info_listbox li span:first-child {color:var(--color-text-sub);}
.course_info_listbox li .con {color:var(--color-text-base);}
/* 리스트 */
.course_info_list {margin:0; padding:0; display:flex; flex-direction:column; gap:16px;}
.course_info_list li {display:flex; align-items:center; font-size:16px; color:var(--color-text-base);}
.course_info_list li span:first-child {min-width:100px; color:var(--color-text-sub);}
.course_info_list li .con {flex:1; min-width:0; color:var(--color-text-base);}
.course_info_list li .con #review_day, .course_info_list li .con .date {color:var(--color-secondary); font-weight:600;}
.course_info_list li .con .selectBox {position:relative; display:block; width:100%; box-sizing:border-box; }
.course_info_list li .con .selectBox .select {position:relative; padding:4px; border:1px solid var(--color-text-sub); cursor:pointer;}
.course_info_list li .con .selectBox .select::after {position:absolute; content:'\f078'; font-family:'FontAwesome'; font-size:14px; right:10px; top:50%; transform:translateY(-50%);}
.course_info_list li .con .selectBox .optionBox {position:absolute; top:100%; left:0; right:0; padding:4px; cursor:pointer; background:var(--color-white); z-index:10; box-sizing:border-box;
											border-left:1px solid var(--color-text-sub); border-right:1px solid var(--color-text-sub); border-bottom:1px solid var(--color-text-sub);}
.course_info_list li .con .selectBox .optionBox ul {display:flex; flex-direction:column; gap:8px;}
/* 모집 마감 */
.course_info_list .lect_close_info {padding:16px; justify-content:center; font-size:15px; text-align:center; background:var(--color-red); color:var(--color-white); border-radius:8px;}
@media (max-width:640px){
	.course_card {flex-direction:column; gap:16px; padding-bottom:0;}
	.course_thumb {flex:0 0 auto; width:100%; border-radius:8px;}
	/* 버튼 */
	.course_btn_area {position:relative; top:0; left:auto; width:100%; order:3;}
	.course_btn_area .application {font-size:18px; order:3;}
	.course_btn_area .application i {font-size:18px;}
	/* 정보 영역 */
	.course_info_area {order:2; width:100%;}
	.course_regno {font-size:13px;}
	.course_title h3 {font-size:18px;}
	/* 리스트 박스 */
	.course_info_listbox {column-gap:0; row-gap:8px;}
	.course_info_listbox li {flex:0 0 100%;}
	.course_info_list li span:first-child {min-width:80px;}
	.course_info_list li .con .selectBox .select {padding:4px 20px 4px 4px;}
	.course_info_list li .con .selectBox .select a {display:block; width:100%; box-sizing:border-box; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
}



/* 과정소개 상단 배너 */
.sub-banner-img {width:100%; overflow:hidden; background:var(--color-secondary-bglight);}
.sub-banner-img img {display:block; width:100%; height:150px; object-fit:cover; object-position:center;}
@media screen and (max-width:640px) { 
	.sub-banner-img img {max-width:800px; height:auto;}
}
/* 과정소개 상단 정보 */
.lect-view-head {display:flex; gap:40px; align-items:stretch; box-sizing:border-box;}
.lect-view-head .lect-thumb {flex:0 0 390px; border-radius:8px; overflow:hidden;}
.lect-view-head .lect-thumb img {display:block; width:100%; height:auto; aspect-ratio:9/10; object-fit:cover;}
/* 우측 정보 */
.lect-view-head .lect-info {flex:1; display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:20px;}
.lect-view-head .lect-info .lect-title {display:flex; flex-direction:column; align-items:start; gap:16px;}
.lect-view-head .lect-info .lect-title p {display:inline-flex; align-items:center; gap:8px; padding:8px; border-radius:4px; background:var(--color-border-light); color:var(--color-text-sub); font-size:16px;}
.lect-view-head .lect-info .lect-title p span {position:relative; display:inline-block; margin-right:8px;}
.lect-view-head .lect-info .lect-title p span::after {content:""; position:absolute; top:1px; right:-8px; width:1px; height:16px; background:var(--color-border);}
.lect-view-head .lect-info .lect-title h3 {font-size:28px;}
.lect-view-head .lect-info .lect-list-box {display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:20px;}
.lect-view-head .lect-info .lect-list-box li {display:flex; flex-flow:row nowrap; align-items:center;}
.lect-view-head .lect-info .lect-list-box li .tit {width:120px; color:var(--color-text-sub);}
.lect-view-head .lect-info .lect-list-box.list01 {padding:20px 0; border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
.lect-view-head .lect-info .lect-list-box.list01 li.pay01 .con {display:flex; align-items:center; gap:8px;}
.lect-view-head .lect-info .lect-list-box.list01 li.pay01 .con .prev-price {color:var(--color-text-sub-light); font-weight:normal; text-decoration:line-through;}
.lect-view-head .lect-info .lect-list-box.list01 li.pay01 .con .price {font-size:28px; font-weight:600; color:var(--color-red);}
.lect-view-head .lect-info .lect-list-box.list01 li.pay02 .con {font-weight:600;}
.lect-view-head .lect-info .lect-list-box.list02 li.congr .con {font-size:18px; color:var(--color-text);}
.lect-view-head .lect-info .lect-list-box.list02 li .con {color:var(--color-red);}
.lect-view-head .lect-info .lect-btn {display:flex; align-items:center; gap:20px;}
.lect-view-head .lect-info .lect-btn li {flex:1; display:flex; align-items:center; justify-content:start;}
.lect-view-head .lect-info .lect-btn li:first-child {flex:140px 0 0;}
.lect-view-head .lect-info .lect-btn button {flex:1; padding:16px; font-size:18px; border-radius:8px; box-sizing:border-box;}
.lect-view-head .lect-info .lect-btn button.interest {flex:140px 0 0; border:1px solid var(--color-border); color:var(--color-text-sub);}
.lect-view-head .lect-info .lect-btn button.interest:hover, .lect-view-head .lect-info .lect-btn button.interest.on {border:1px solid var(--color-red); color:var(--color-red);}
.lect-view-head .lect-info .lect-btn button.application {background:var(--color-accent); color:#fff;}
.lect-view-head .lect-info .lect-btn button.application:hover {background:var(--color-accent-dark);}
.lect-view-head .lect-info .lect-btn button.mylect {background:var(--color-orange); color:#fff;}
.lect-view-head .lect-info .lect-btn button.mylect:hover {background:var(--color-orange-dark);}
.lect-view-head .lect-info .lect-btn button.delete {background:var(--color-text-sub-light);}
@media (max-width:640px){
	.lect-view-head {flex-direction:column; gap:20px;}
	.lect-view-head .lect-thumb {flex:1; width:100%;}
	.lect-view-head .lect-info .lect-title {gap:8px;}
	.lect-view-head .lect-info .lect-title p {font-size:14px;}
	.lect-view-head .lect-info .lect-title p span::after {height:15px;}
	.lect-view-head .lect-info .lect-title h3 {font-size:24px;}
	.lect-view-head .lect-info .lect-list-box {gap:16px;}
	.lect-view-head .lect-info .lect-list-box.list01 {gap:16px;}
	.lect-view-head .lect-info .lect-list-box li div {font-size:16px;}
	.lect-view-head .lect-info .lect-btn li:first-child {flex:0 0 auto;}
	.lect-view-head .lect-info .lect-btn {gap:16px;}
	.lect-view-head .lect-info .lect-btn button.interest {flex:0 0 auto;}
	.lect-view-head .lect-info .lect-btn button.interest span{display:none;}
}
/* 하단 레이아웃 및 탭박스 */
.lect-view-body {position:relative; margin-top:80px; width:100%; box-sizing:border-box;}
.lect-view-body .lect-info {padding:40px 0;}
.lect-view-body .lect-info .tab-content {display:none;}
.lect-view-body .lect-info .tab-content.current {display:block;}
.lect-view-body .tabBox .tabs {display:flex; align-items:center; justify-content:space-between;}
.lect-view-body .tabBox .tabs .tab-link {flex:1; padding:16px; border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border); font-size:24px; text-align:center; box-sizing:border-box; cursor:pointer;}
.lect-view-body .tabBox .tabs .tab-link.current, .lect-view-body .tabBox .tabs .tab-link:hover {border-top:1px solid var(--color-secondary); border-bottom:1px solid var(--color-secondary); font-weight:600; background:var(--color-secondary-bglight); color:var(--color-secondary);}
@media (max-width:640px){
	.lect-view-body {margin-top:40px;}
	.lect-view-body .tabBox .tabs .tab-link {padding:16px 0; font-size:18px;}
}
/* 하단 정보 */
.lect-view-body .info-box {position:relative; margin-bottom:40px; width:100%; display:flex; flex-direction:column; gap:20px; align-items:start;}
.lect-view-body .info-box .tit {position:relative; padding-left:12px; font-size:21px; font-weight:600;}
.lect-view-body .info-box .tit::before {content:""; display:inline-block; position:absolute; top:0; left:0; width:4px; height:25px; background:var(--color-secondary);}
.lect-view-body .info-box .con {width:100%; box-sizing:border-box;}
.lect-view-body .info-box .con.img {text-align:center;}
.lect-view-body .info-box .con.img img {width:100%;}
/* 과정소개 */
.lect-view-body .info-box .intro {padding:20px; background:var(--color-border-light); border-radius:8px;}
.lect-view-body .info-box .goal {padding:20px; background:var(--color-primary-bglight); border-radius:8px;}
/* 자격증 미리보기 */
.lect-view-body .info-box .certifi-preview img {max-width:900px;}
.lect-view-body .info-box .certifi-preview p {margin-bottom:16px; padding:8px 20px; display:inline-block; background:#413575; color:#fff; font-size:16px; border-radius:1000px;}
/* 강의정보 */
.lect-view-body .info-box .class-info-card {display:flex; align-items:stretch; gap:40px; box-sizing:border-box;}
.lect-view-body .info-box .class-info-card .card01 {flex:1; padding:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:40px; text-align:center; border-radius:8px; background:var(--color-primary-darken); color:#fff; box-sizing:border-box;}
.lect-view-body .info-box .class-info-card .card01 > div {display:flex; flex-direction:column; gap:16px;}
.lect-view-body .info-box .class-info-card .card01 > div p {font-size:28px; font-weight:600; color:var(--color-primary-bglight);}
.lect-view-body .info-box .class-info-card .card01 > div div {padding:16px; font-size:24px; font-weight:600; background:var(--color-primary-bglight); color:var(--color-primary-darken); border-radius:1000px;}
.lect-view-body .info-box .class-info-card .card01 > p {font-size:15px; line-height:150%;}
.lect-view-body .info-box .class-info-card .card01 ul {padding-top:40px; width:100%; display:flex; flex-direction:column; align-items:start; gap:16px; border-top:1px solid var(--color-primary-bglight);}
.lect-view-body .info-box .class-info-card .card01 ul li {font-size:16px; text-align:left;}
.lect-view-body .info-box .class-info-card .card01 ul li span {display:inline-block; width:100px; font-weight:600;}
.lect-view-body .info-box .class-info-card .card02 {width:400px; padding:40px; display:flex; flex-direction:column; align-items:center; justify-content:start; gap:40px; text-align:center; border-radius:8px; background:var(--color-border-light); box-sizing:border-box;}
.lect-view-body .info-box .class-info-card .card02 > p {font-size:28px; font-weight:600;}
.lect-view-body .info-box .class-info-card .card02 > ul {width:100%; display:flex; flex-direction:column; gap:20px; text-align:left;}
.lect-view-body .info-box .class-info-card .card02 > ul li {display:flex; align-items:center;}
.lect-view-body .info-box .class-info-card .card02 > ul li span {flex:0 0 100px;display:inline-block; font-weight:600;}
.lect-view-body .info-box .class-info-card .card02 > ul li p {white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:18px;}
@media (max-width:640px){
	.lect-view-body .info-box .class-info-card {flex-direction:column;}
	.lect-view-body .info-box .class-info-card .card01 {padding:30px; gap:20px;}
	.lect-view-body .info-box .class-info-card .card01 > div p {font-size:24px;}
	.lect-view-body .info-box .class-info-card .card01 > p {font-size:14px; line-height:130%;}
	.lect-view-body .info-box .class-info-card .card01 ul {padding-top:20px;}
	.lect-view-body .info-box .class-info-card .card02 {flex:1; width:100%; padding:30px; gap:30px;}
	.lect-view-body .info-box .class-info-card .card02 > p {font-size:24px;}
	.lect-view-body .info-box .class-info-card .card02 > ul li {font-size:16px;}
	.lect-view-body .info-box .class-info-card .card02 > ul li span {flex:0 0 80px;}
}
/* 강사소개 */
.lect-view-body .info-box .teacher {padding:40px; display:flex; gap:40px; align-items:start; background:var(--color-border-light);}
.lect-view-body .info-box .teacher img {width:100%; height:auto; max-width:120px; aspect-ratio:3/4; background:#fff;}
.lect-view-body .info-box .teacher ul {display:flex; flex-direction:column; gap:20px;}
.lect-view-body .info-box .teacher .name {font-size:21px; font-weight:600;}
.lect-view-body .info-box .teacher .con {font-size:16px; color:var(--color-text-sub);}
@media (max-width:640px){
	.lect-view-body .info-box .teacher {padding:20px; gap:20px; flex-direction:column;}
	.lect-view-body .info-box .teacher img {margin:0 auto;}
	.lect-view-body .info-box .teacher ul {gap:8px;}
}
/* 자격증 이력서 안내 */
.lect-view-body .info-box .resume {text-align:center;}
.lect-view-body .info-box .resume ul {padding:40px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:var(--color-secondary-bglight); border:2px solid var(--color-secondary); border-radius:8px;}
.lect-view-body .info-box .resume ul span {font-size:18px;}
.lect-view-body .info-box .resume ul div {margin-top:8px; font-size:21px; font-weight:600;}
.lect-view-body .info-box .resume > p {margin-top:20px; text-align:left; font-size:14px; color:var(--color-text-sub-light);}
@media (max-width:640px){
	.lect-view-body .info-box .resume > img {width:90%;}
	.lect-view-body .info-box .resume ul {padding:20px; flex-direction:column;}
	.lect-view-body .info-box .resume ul span {font-size:16px;}
	.lect-view-body .info-box .resume ul div {font-size:18px;}
}
/* 커리큘럼 */
.lect-view-body .info-box .tit-btn-box {width:100%; display:flex; justify-content:space-between;}
.lect-view-body .info-box .curri-tb .preview {padding:8px; display:flex; align-items:center; gap:8px; font-size:16px; border-radius:8px; background:var(--color-secondary); color:#fff;
															position:absolute; top:-3px; right:0;}
.lect-view-body .info-box .curri-tb .preview:hover {background:var(--color-secondary-dark);}
.lect-view-body .info-box .curri-tb .preview img {width:20px; height:auto;}
.lect-view-body .info-box .curri-tb {width:100%; border-top:2px solid var(--color-text-base);}
.lect-view-body .info-box .curri-tb li {padding:20px; display:flex; align-items:center; justify-content:start; gap:8px; border-bottom:1px solid var(--color-border);}
.lect-view-body .info-box .curri-tb .num {flex:70px 0 0; height:70px; display:flex; align-items:center; justify-content:center; text-align:center; box-sizing:border-box; font-size:18px; font-weight:600; border-radius:1000px; background:var(--color-secondary-bglight); color:var(--color-secondary-dark);}
.lect-view-body .info-box .curri-tb .name {font-size:18px;}
.lect-view-body .info-box .curri-tb .time {margin-left:auto; display:flex; align-items:center; gap:4px; color:var(--color-text-sub-light); font-size:14px;}
@media (max-width:640px){
	.lect-view-body .info-box .curri-tb li {padding:16px 8px;}
	.lect-view-body .info-box .curri-tb .num {flex:60px 0 0; height:auto; padding:8px; font-size:16px;}
	.lect-view-body .info-box .curri-tb .name {font-size:16px;}
}
/* 하단 버튼 */
.lect-btn {width:100%; display:flex; align-items:center; justify-content:center; gap:20px;}
.lect-btn .mylect {background:var(--color-orange); color:#fff;}
.lect-btn .mylect:hover {background:var(--color-orange-dark);}





/* 자격증 신청 페이지 */
/* 신청 탭 디자인 */
.mylect-tab-menu.award-cart li:hover, .mylect-tab-menu.award-cart li.current {color:var(--color-primary); border:1px solid var(--color-primary); background:var(--color-primary-bglight);}
.mylect-tab-menu.award-cart li:hover span, .mylect-tab-menu.award-cart li.current span {background:var(--color-primary);}
/* 신청 페이지 */
.award_cart_area {position:relative; margin:0 auto; padding:0; width:100%; display:flex; flex-flow:column nowrap; gap:20px;}
.award_cart_area .award_tb > ul > li.li_01 {flex:5 1 0;}
.award_cart_area .award_tb > ul > li.li_02 {flex:50 1 0;}
.award_cart_area .award_tb > ul > li.li_03 {flex:20 1 0;}
.award_cart_area .award_tb > ul > li.li_04 {flex:25 1 0;}
.award_cart_area .award_tb > ul.total2 li {background:var(--color-border-light);}
.award_cart_area .total .price {margin-left:8px;}
.award_cart_area .award_btn {display:flex; gap:16px;}
.award_cart_area .none_result {margin-top:0; justify-content:center; border-right:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.award_cart_area .none_result li {border:none; padding:0;}
@media (max-width:640px){
	.award_cart_area .award_tb > ul > li.li_03 {display:none;}
}
/* 신청 패키지 페이지 */
.award_cart_area .award_tb.package > ul.head > li.li_02 {align-items:center;}
.award_cart_area .award_tb.package > ul.head > li.li_03 {align-items:center;}
.award_cart_area .award_tb.package > ul > li.li_01 {flex:5 1 0;}
.award_cart_area .award_tb.package > ul > li.li_02 {flex:70 1 0; padding:0; justify-content:space-around; align-items:stretch; min-width:0; flex-direction:column;}
.award_cart_area .award_tb.package > ul > li.li_02 > p {padding:16px 8px; font-weight:600;}
.award_cart_area .award_tb.package > ul > li.li_02 > ul {padding:16px 8px; display:flex; flex-flow:row wrap; justify-content:center; border-top:1px dotted var(--color-border);}
.award_cart_area .award_tb.package > ul > li.li_02 > ul li {padding:0; width:auto; border:none; color:var(--color-text-sub); white-space:normal;}
.award_cart_area .award_tb.package > ul > li.li_03 {flex:25 1 0; padding:0; justify-content:space-around; align-items:stretch; min-width:0;}
.award_cart_area .award_tb.package > ul > li.li_03 > p {width:100%; padding:8px; display:flex; align-items:center; justify-content:center; box-sizing:border-box;}
.award_cart_area .award_tb.package > ul > li.li_03 > ul {flex:1; display:flex; flex-direction:column;; min-width:0; text-align:center;}
.award_cart_area .award_tb.package > ul > li.li_03 > ul li {padding:8px; width:100%; border-bottom:1px solid var(--color-border); box-sizing:border-box;}
.award_cart_area .award_tb.package > ul > li.li_03 > ul li:last-child {border-bottom:none;}
.award_cart_area .award_tb.package > ul > li.li_03 > ul li.no-package {padding:0; background:var(--color-red);}
.award_cart_area .award_tb.package > ul > li.li_03 > ul li.no-package button {padding:8px; width:100%; color:var(--color-white); font-size:16px; box-sizing:border-box;}
.award_cart_area .award_tb.package > ul > li.li_03 > ul li.no-package button:hover {background:var(--color-red-dark);}
.award_cart_area .award_tb.package > ul > li.li_04 {display:none;}
@media (max-width:640px){
	.award_cart_area .award_tb.package > ul > li.li_02 > p {width:100%; padding:8px; border-right:none; border-bottom:1px solid var(--color-border);}
	.award_cart_area .award_tb.package > ul > li.li_02 > ul {padding:8px;}
	.award_cart_area .award_tb.package > ul > li.li_03 {display:flex;}
}
/* 결제 페이지 */
.award_pay_area {position:relative; margin:0 auto; margin-bottom:40px; padding:0; width:100%; display:flex; flex-flow:column nowrap; gap:20px;}
.coupon_select_area {display:flex; align-items:center;}
.coupon_select_area select {flex:1; padding:8px 40px 8px 16px; height:40px; font-size:16px; border:1px solid var(--color-primary); color:var(--color-primary-dark); cursor:pointer; box-sizing:border-box;}
.coupon_select_area button {margin-left:8px; padding:10px 20px; border-radius:4px; font-size:16px;}
.coupon_total_txt {margin-left:16px; padding:8px 16px; background:var(--color-primary-bglight); border-radius:1000px;}

.award_pay_tb01 > ul > li.li_02 {flex:75 1 0; padding:0;}
.award_pay_tb01 > ul > li.li_02 > div {width:100%; display:flex; flex-direction:column;}
.award_pay_tb01 > ul > li.li_02 > div p {padding:16px 8px; font-weight:600;}
.award_pay_tb01 > ul > li.li_02 > div ul {padding:16px 8px; display:flex; flex-flow:row wrap; justify-content:center; border-top:1px dotted var(--color-border); box-sizing:border-box;}
.award_pay_tb01 > ul > li.li_02 > div ul li {padding:0; width:auto; border:none; color:var(--color-text-sub); white-space:normal;}
.award_pay_tb01 > ul > li.li_03 {flex:25 1 0;}
.award_pay_tb02 > ul > li.li_01 {flex:20 1 0;}
.award_pay_tb02 > ul > li.li_02 {flex:20 1 0;}
.award_pay_tb02 > ul > li.li_03 {flex:20 1 0;}
.award_pay_tb02 > ul > li.li_04 {flex:20 1 0;}
.award_pay_tb02 > ul > li.li_05 {flex:20 1 0;}
.pay_means_area {display:flex; align-items:center; gap:20px;}
.pay_means_area label {display:flex; align-items:center; gap:4px; cursor:pointer;}
.pay_means_area label input[type=radio] {width:16px; height:16px;accent-color:var(--color-primary); cursor:pointer;}
.pay_means_bank {display:flex; flex-direction:column; gap:16px;}
.pay_means_bank .pay_means_bankinfo {display:flex; flex-direction:row; gap:8px; flex:1;}
.pay_means_bank select {flex:50 1 0; padding:8px 40px 8px 16px; height:40px; font-size:16px; cursor:pointer; box-sizing:border-box;}
.pay_means_bank input {flex:50 1 0; font-size:16px;}
/* 회원정보 입력 */
.award_pay_area .award_title_area {display:flex; align-items:end; justify-content:space-between;}
.award_pay_area .column_tb ul {flex-wrap:wrap;}
.award_pay_area .column_tb .column_list01 {flex:30 1 0; box-sizing:border-box;}
.award_pay_area .column_tb .column_list02 {flex:70 1 0; box-sizing:border-box;}
.award_pay_area .column_tb .address {flex:146px 1 0;}
.award_pay_area .column_tb .address_area {display:flex; flex-flow:column nowrap; align-items:start; gap:8px;}
.award_pay_area .column_tb .address_area > div {display:flex; gap:4px;}
.award_pay_area .column_tb .address_area > div > button {padding:8px 16px; white-space:nowrap;}
.award_pay_area .column_tb input {width:100%; font-size:16px;}
.award_pay_area .column_tb .til_icon {margin:-4px 0 0 1px;}
@media (max-width:640px){
	.coupon_select_area {flex-flow:row wrap; align-items:start;}
	.coupon_select_area select {flex:60 1 0;}
	.coupon_select_area button {flex:40 1 0;}
	.coupon_total_txt {display:none;}
	.pay_means_bank .pay_means_bankinfo {flex-direction:column;}
	.pay_means_bank .pay_means_bankinfo select {padding:4px 40px 4px 8px;}
	.pay_means_bank .pay_means_bankinfo input {padding:6px 8px;}
	.award_pay_tb01 > ul > li.li_02 > div p {padding:8px;}
	.award_pay_tb01 > ul > li.li_02 > div ul {padding:8px;}
	.award_pay_tb02 > ul > li.li_01 {flex:10 1 0;}
	.award_pay_tb02 > ul > li.li_02 {flex:24 1 0;}
	.award_pay_tb02 > ul > li.li_03 {flex:22 1 0;}
	.award_pay_tb02 > ul > li.li_04 {flex:22 1 0;}
	.award_pay_tb02 > ul > li.li_05 {flex:22 1 0;}
	.award_pay_area .column_tb ul {flex-wrap:wrap;}
	.award_pay_area .column_tb .column_list01 {flex:0 0 30%;}
	.award_pay_area .column_tb .column_list02 {flex:0 0 70%;}
	.pay_means_info {font-size:14px;}
}



/* 유의사항 */
.caution-box {padding:30px; display:flex; flex-direction:column; gap:20px; background:var(--color-border-light); border-radius:20px;}
.caution-box p {display:flex; align-items:center; gap:8px; font-size:18px; font-weight:600;}
.caution-box p span {padding:6px 8px; color:var(--color-secondary-dark); background:var(--color-white); font-size:14px; font-weight:normal; border-radius:1000px;}
.caution-box p span i {color:var(--color-secondary); font-size:14px;}
.caution-box ul {display:grid; gap:8px; grid-template-columns:repeat(1, 1fr);}
@media (max-width:640px){
	.caution-box {padding:20px;}
	.caution-box p {font-size:16px;}
	.caution-box ul {grid-template-columns:1fr;}
	.caution-box ul li {font-size:15px;}
}



/* 자격증 발급 내역 페이지 */
.award_issue_area .award_tb > ul > li.li_01 {flex:10 1 0;}
.award_issue_area .award_tb > ul > li.li_02 {flex:45 1 0; white-space: normal;}
.award_issue_area .award_tb > ul > li.li_03 {flex:15 1 0;}
.award_issue_area .award_tb > ul > li.li_04 {flex:15 1 0;}
.award_issue_area .award_tb > ul > li.li_05 {flex:15 1 0;}
.award_issue_area .award_tb > ul > li.wait {color:var(--color-text-sub);}
.award_issue_area .award_tb > ul > li.completion {color:var(--color-secondary);}
.award_issue_area .award_tb > ul > li.delete {color:var(--color-red);}
.award_issue_btn {display:flex; gap:8px;}
.award_issue_area .none_result {margin-top:0; justify-content:center; border-right:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
.award_issue_area .none_result li {border:none; padding:0;}
@media (max-width:640px){
	.award_issue_area .award_tb > ul > li.li_03 {display:none;}
	.award_issue_area .award_tb > ul > li.li_04 {display:none;}
	.award_issue_area .award_tb > ul > li.li_05 {flex:25 1 0;}
}

/* 발급 내역 상세 */
.award_issue_area .column_tb ul {flex-wrap:wrap;}
.award_issue_area .column_tb .column_list01 {flex:30 1 0;  box-sizing:border-box;}
.award_issue_area .column_tb .column_list02 {flex:70 1 0;  box-sizing:border-box;}
.award_issue_area .column_tb .wait {color:var(--color-text-sub);}
.award_issue_area .column_tb .completion {color:var(--color-secondary);}
.award_issue_area .column_tb .delete {color:var(--color-red);}
.award_issue_area .award_issue_title {margin:40px 0 20px 0; font-size:21px; font-weight:600; color:var(--color-primary);}
@media (max-width:640px){
	.award_issue_area .column_tb .column_list01 {flex:0 0 40%;}
	.award_issue_area .column_tb .column_list02 {flex:0 0 60%;}
	.award_issue_area .award_issue_title {margin-bottom:16px; font-size:18px;}
}



/* 나의 쿠폰 */
.coupon_tb .li_01 {flex:50 1 0;}
.coupon_tb .li_02 {flex:30 1 0;}
.coupon_tb .li_03 {flex:20 1 0;}
.coupon_tb .coupon_box .li_02 {font-size:21px; font-weight:600; color:var(--color-red);}
.coupon_tb .coupon_box .li_02.end {color:var(--color-text-sub);}
.coupon_tb .coupon_box .li_03 {display:flex; flex-direction:column; gap:8px;}
.coupon_tb .coupon_box .li_03 p {font-weight:600; color:var(--color-red);}
.coupon_tb .coupon_box .li_03 span {font-size:14px; color:var(--color-text-sub-light);}
.coupon_tb .none_result {margin:0; padding:0; border-right:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
.coupon_tb .none_result > li {width:100%; color:var(--color-text-sub); border:none;}
@media (max-width:640px){
	.coupon_tb .li_01 {flex:30 1 0; white-space:normal;}
	.coupon_tb .li_02 {flex:40 1 0;}
	.coupon_tb .li_03 {flex:30 1 0; gap:4px;}
	.coupon_tb .coupon_box .li_02 {font-size:18px;}
	.coupon_tb .coupon_box .li_03 span {white-space:normal;}
}




/* 나의강의실 */
/* 탭메뉴*/
.mylect-tab-menu {margin:40px 0; display:flex; align-items:stretch; gap:40px;}
.mylect-tab-menu li {flex:1; display:flex; align-items:center; justify-content:center; gap:20px; padding:20px; font-size:21px; font-weight:600; text-align:center; border-radius:1000px; 
					 color:var(--color-text-sub); border:1px solid var(--color-border); background:var(--color-border-light); cursor:pointer; box-sizing:border-box;}
.mylect-tab-menu li:hover, .mylect-tab-menu li.current {color:var(--color-secondary); border:1px solid var(--color-secondary); background:var(--color-secondary-bglight);}
.mylect-tab-menu li span {display:flex; align-items:center; justify-content:center; width:40px; height:40px; font-size:24px; border-radius:1000px; color:var(--color-white); background:var(--color-text-sub-light);}
.mylect-tab-menu li:hover span, .mylect-tab-menu li.current span {background:var(--color-secondary);}
@media (max-width:640px){
	.mylect-tab-menu {margin:20px 0; gap:20px;}
	.mylect-tab-menu li {padding:12px 8px; gap:8px; font-size:18px;}
	.mylect-tab-menu li span {width:28px; height:28px; font-size:18px;}
}

/* 탭내용공간 */
.mylect-tab-content {display:none; width:100%; box-sizing:border-box;}
.mylect-tab-content.current {display:block;}
.mylect-tab-content .mylect-catetitle {padding:40px 0 20px 0; font-size:21px; font-weight:600;}
.mylect-tab-content .mylect-catetitle span {font-size:24px; color:var(--color-accent);}
.mylect-tab-content .mylect-box {margin-bottom:40px; padding:40px; width:100%; display:flex; flex-direction:column; gap:40px; background:var(--color-secondary-bglight); 
												border-radius:20px; box-sizing:border-box;}
@media (max-width:640px){
	.mylect-tab-content .mylect-catetitle {font-size:18px;}
	.mylect-tab-content .mylect-box {padding:20px;}
}

/* 강의목록 */
.mylect-box .mylect-card {padding:40px; width:100%; background:var(--color-white); border-radius:20px; box-sizing:border-box; display:flex; align-items:stretch; gap:40px;}
.mylect-card .mylect-thumb {position:relative; overflow:hidden; width:100%; height:100%; max-width:180px; border-radius:8px; aspect-ratio:9 / 10; object-fit:cover;}
.mylect-card .mylect-info {position:relative; flex:1; display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:20px;}
/* 진도율 */
.mylect-card .mylect-info .mylect-prog {position:absolute; top:0; right:0; width:100px; height:100px; background:var(--color-secondary-bglight); border-radius:1000px;
														display:flex; flex-direction:column; gap:4px; align-items:center; justify-content:center;}
.mylect-card .mylect-info .mylect-prog span {font-size:15px; color:var(--color-text-base-light);}
.mylect-card .mylect-info .mylect-prog p {font-size:24px; font-weight:600; color:var(--color-secondary);}
/* 타이틀, 채점점수 */
.mylect-card .mylect-info .mylect-title {display:flex; align-items:center; gap:16px;}
.mylect-card .mylect-info .mylect-title h6 {font-size:28px;}
.mylect-card .mylect-info .mylect-title button {padding:6px 8px; font-size:15px; color:var(--color-white); border-radius:8px;}
.mylect-card .mylect-info .mylect-title .btn-test-pass {background:var(--color-secondary);}
.mylect-card .mylect-info .mylect-title .btn-test-pass:hover {background:var(--color-secondary-dark);}
.mylect-card .mylect-info .mylect-title .btn-test-fail {background:var(--color-red);}
.mylect-card .mylect-info .mylect-title .btn-test-fail:hover {background:var(--color-red-dark);}
/* 기간 정보 */
.mylect-card .mylect-info > ul {display:flex; flex-direction:column; align-items:start; justify-content:center; gap:12px; font-size:14px; color:var(--color-text-sub-light);}
.mylect-card .mylect-info > ul li {display:flex; align-items:baseline; gap:4px; font-size:14px; color:var(--color-text-sub-light);}
.mylect-card .mylect-info > ul li i {font-size:14px; color:var(--color-text-sub-lighter);}
.mylect-card .mylect-info > ul li .mylect-dday {margin-left:4px; padding:2px 8px; color:var(--color-white); background:var(--color-text-sub-light); border-radius:1000px;}
/* 강의 시험 버튼 */
.mylect-card .mylect-btn {display:flex; align-items:center; gap:20px;}
.mylect-card .mylect-btn button {flex:1; padding:20px; font-size:18px; font-weight:600; border-radius:8px; line-height:1; border:1px solid transparent; box-sizing:border-box;}
.mylect-card .mylect-btn .btn-mylect-mov {display:inline-flex; align-items:center; justify-content:center; gap:8px; color:var(--color-white); background:var(--color-accent);}
.mylect-card .mylect-btn .btn-mylect-mov span {line-height:1;}
.mylect-card .mylect-btn .btn-mylect-mov i {color:var(--color-secondary-bglight); transform:translateY(1px);}
.mylect-card .mylect-btn .btn-mylect-mov:hover {background:var(--color-accent-dark);}
.mylect-card .mylect-btn .btn-mylect-test {color:var(--color-primary); border:1px solid var(--color-primary);}
.mylect-card .mylect-btn .btn-mylect-test:hover { color:var(--color-white); background:var(--color-primary);}
.mylect-card .mylect-btn .btn-mylect-retest {color:var(--color-red); border:1px solid var(--color-red);}
.mylect-card .mylect-btn .btn-mylect-retest:hover { color:var(--color-white); background:var(--color-red);}
.mylect-card .mylect-btn .btn-mylect-pass {color:var(--color-white); background:var(--color-orange-light);}
.mylect-card .mylect-btn .btn-mylect-pass:hover {background:var(--color-orange);}
@media (max-width:640px){
	.mylect-box .mylect-card {padding:16px;}
	.mylect-card .mylect-thumb {display:none;}
	.mylect-card .mylect-info {gap:8px;}
	.mylect-card .mylect-info .mylect-prog {position:relative; width:fit-content; height:fit-content; padding:8px; display:inline-flex; flex-direction:row; justify-content:start;}
	.mylect-card .mylect-info .mylect-prog p {font-size:15px;}
	.mylect-card .mylect-info .mylect-title h6 {font-size:24px;}
	.mylect-card .mylect-info .mylect-title button {position:absolute; top:0; right:0;}
	.mylect-card .mylect-info > ul {margin:8px 0;}
	.mylect-card .mylect-btn {flex-direction:column; gap:8px;}
	.mylect-card .mylect-btn button {width:100%; padding:16px; font-size:16px;}
	.mylect-card .mylect-btn .btn-mylect-mov i {transform:translateY(0);}
}
/* 패키지 */
.mylect-tab-content .mylect-box.package {gap:60px;}
.mylect-tab-content .mylect-box.package > li {display:flex; flex-direction:column; gap:20px;}
.mylect-box.package .package-title {padding:8px; font-size:21px; color:var(--color-secondary-dark); background:var(--color-white); border-radius:1000px; text-align:center;}
.mylect-box.package .mylect-card .mylect-btn .btn-mylect-pass {color:var(--color-secondary); background:var(--color-secondary-bglight); cursor:default;}
.mylect-tab-content .mylect-box.package > li > .btn-mylect-pass {padding:20px; font-size:21px; font-weight:600; color:var(--color-white); background:var(--color-orange-light); border-radius:8px; text-align:center;}
.mylect-tab-content .mylect-box.package > li > .btn-mylect-pass:hover {background:var(--color-orange);}
.mylect-tab-content .mylect-box.package > li > .btn-mylect-pass.disabled {color:var(--color-white); background:var(--color-text-sub-lighter);}
@media (max-width:640px){
	.mylect-box.package .package-title {font-size:18px;}
}
/* 종료된과정 */
.mylect-tab-content .mylect-box.end {background:var(--color-border-light);}
.mylect-box.package.end .package-title {color:var(--color-white); background:var(--color-text-sub-light);}
/* 과정 없을 시 */
.mylect-tab-content .mylect-box .none_result {margin:0; padding:0;}
.mylect-tab-content .mylect-box .none_result .mylect-card {align-items:center; justify-content:center; text-align:center; color:var(--color-text-sub);}





/* 강의듣기 */
/* 전체 레이아웃 */
.stdpop-wrap {display:flex; flex-direction:row; align-items:stretch; gap:40px; margin:0 auto; padding:20px; width:100%; height:100vh; box-sizing:border-box;}
@media (max-width:1024px){
	.stdpop-wrap {flex-direction:column; height:auto;} 
}
/* 메인 영역 */
.stdpop-wrap .stdpop-main {flex:8; min-width:0; display:flex; flex-direction:column; gap:20px;}
.stdpop-main .stdpop-title {display:flex; align-items:center; justify-content:space-between;}
.stdpop-main .stdpop-title h1 {font-size:32px; font-weight:700;}
.stdpop-main .stdpop-title span {padding:8px 12px; font-size:15px; color:var(--color-text-sub); background:var(--color-border-light); border-radius:1000px;}
@media (max-width:1024px){
	.stdpop-wrap .stdpop-main {max-width:100%;}
	.stdpop-main .stdpop-title {flex-direction:column;}
	.stdpop-main .stdpop-title h1 {font-size:24px;}
	.stdpop-main .stdpop-title span {display:none;}
}
/* 비디오 영역 */
.stdpop-main .stdpop-video {width:100%; aspect-ratio:5 / 3; overflow:hidden; background:var(--color-text-base);}
.stdpop-main .stdpop-video video {width:100%; height:100%; object-fit:cover; object-position:center; cursor:pointer;}
@media (max-width:1024px){
	.stdpop-main .stdpop-video {aspect-ratio:16 / 9;}
	.stdpop-main .stdpop-video video {object-fit:contain;}
}
/* 서브타이틀 */
.stdpop-main .stdpop-subtitle {position:relative; display:flex; flex-direction:column; gap:20px;}
.stdpop-main .stdpop-subtitle .head {display:flex; align-items:baseline; justify-content:space-between;}
.stdpop-main .stdpop-subtitle .head h2 {font-size:24px; font-weight:600;}
.stdpop-main .stdpop-subtitle .head h2 span {margin-right:8px; color:var(--color-secondary-dark);}
.stdpop-main .stdpop-subtitle .head p {display:flex; align-items:center; gap:8px; font-size:24px; font-weight:600; color:var(--color-secondary);}
.stdpop-main .stdpop-subtitle .head p span {font-size:16px; font-weight:normal; color:var(--color-text-sub-light);}
@media (max-width:1024px){
	.stdpop-main .stdpop-subtitle {display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center;}
	.stdpop-main .stdpop-subtitle .head {display:contents;}
	.stdpop-main .stdpop-subtitle .head h2 {grid-column:1 / -1; font-size:18px;}
	.stdpop-main .stdpop-subtitle .head p {grid-column:2; grid-row:2; font-size:18px; justify-content:end;}
	.stdpop-main .stdpop-subtitle .head p span {display:none;}
}
/* 프로그래스 바 */
.stdpop-main .progress-bar {width:100%; height:10px; background:var(--color-border-light); border-radius:1000px; overflow:hidden;}
.stdpop-main .progress-bar-fill {height:100%; background:var(--color-secondary); border-radius:100px; width:25%;}
@media (max-width:1024px){
	.stdpop-main .progress-bar {grid-column:1; grid-row:2; align-self:center;}
}
/* 종료 버튼 */
.stdpop-main .stdpop-end {display:flex; align-items:center; justify-content:space-between;}
.stdpop-main .stdpop-end p {font-size:16px; color:var(--color-red);}
.stdpop-main .stdpop-end button {padding:12px 20px; font-size:18px; background:var(--color-text-base); color:var(--color-white); border-radius:8px; cursor:pointer;}
.stdpop-main .stdpop-end button:hover {background:var(--color-red);}
@media (max-width:1024px){ 
	.stdpop-main .stdpop-end {grid-column:1 / -1; flex-direction:column; text-align:center; gap:8px;}
	.stdpop-main .stdpop-end button {order:1;}
	.stdpop-main .stdpop-end p {order:2; font-size:13px;}
}
/* 목차 */
.stdpop-wrap .stdpop-list {flex:2; display:flex; flex-direction:column; gap:20px; min-width:320px; box-sizing:border-box;}
@media (max-width:1024px){ 
	.stdpop-wrap  .stdpop-list {flex:none; width:100%; min-width:0;} 
}
/* 자료 시험 버튼 */
.stdpop-info-btn {display:flex; align-items:stretch; box-sizing:border-box;}
.stdpop-info-btn button {flex:1; padding:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; box-sizing:border-box; cursor:pointer;
									font-size:18px; color:var(--color-secondary); background:var(--color-white); border:1px solid var(--color-secondary);}
.stdpop-info-btn button.databtn, .stdpop-info-btn button.databtn:hover {color:var(--color-text-sub); background:var(--color-border-light); border:1px solid var(--color-border);}
.stdpop-info-btn button.databtn.current {color:var(--color-secondary); background:var(--color-white); border:1px solid var(--color-secondary);}
.stdpop-info-btn button.databtn.current + button {border-left:none;}
.stdpop-info-btn button.databtn.current:hover, .stdpop-info-btn button:hover {color:var(--color-white); background:var(--color-secondary); border:1px solid transparent;}
/* 목차 보기 */
.stdpop-table {display:flex; flex-direction:column; flex:1; min-height:0; border:1px solid var(--color-border); font-size:18px; box-sizing:border-box;}
.stdpop-table-head {flex:none; padding:16px; display:flex; align-items:center; justify-content:space-between; font-weight:600; background:var(--color-border-light); border-bottom:1px solid var(--color-border);}
.stdpop-table-head > div {display:flex; align-items:center; gap:8px; color:var(--color-text-base-light);}
.stdpop-table-head > span {color:var(--color-secondary-dark);}
.stdpop-table-body {margin:0; padding:0; flex:1; overflow-y:auto;}
.stdpop-table-body li {padding:19px 16px; display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:16px; border-bottom:1px solid var(--color-border); cursor:pointer;}
.stdpop-table-body li:last-child {border-bottom:none;}
.stdpop-table-body li:hover, .stdpop-table-body li.current {background:var(--color-secondary-bglight);}
.stdpop-table-body li > div {flex:1; display:flex; flex-direction:column; gap:4px; min-width:0;}
.stdpop-table-body li > div span {color:var(--color-secondary-dark);}
.stdpop-table-body li:hover > div p, .stdpop-table-body li.current >div p {color:var(--color-secondary-dark); font-weight:600;}
.stdpop-table-body li > span {flex:0 0 auto; padding:4px; width:52px; text-align:center; font-size:14px; color:var(--color-white); background:var(--color-text-sub-lighter); border-radius:1000px; box-sizing:border-box;}
.stdpop-table-body li.current > span {background:var(--color-secondary);}
.stdpop-table-body li.end {background:var(--color-border-light);}
.stdpop-table-body li.end > span {background:var(--color-secondary-darken);}
@media (max-width:1024px){ 
	.stdpop-info-btn button {padding:16px; font-size:16px;}
	.stdpop-table {height:auto; flex:none; font-size:16px;}
	.stdpop-table-body {overflow-y:visible;}
	.stdpop-table-body li {padding:16px;}
}