/* 온라인 강의 리스트  ================================================================================== */ 
.class_list_wrap						{position:relative;} 
.class_list_wrap>li						{padding:20px 10px; border-bottom:1px solid #ddd;}
.class_list_wrap>li:first-child			{border-top:1px solid #ddd;}
.class_list_wrap>li	a					{display:grid; grid-template-columns:240px auto; gap:0 40px;}
.class_list_wrap .img					{position:relative; overflow:hidden; aspect-ratio:6 / 3.5; border-radius:10px; border:1px solid #eaeaea;}
.class_list_wrap .img img				{width:100%; height:100%; object-fit:cover; transition:all .5s ease;}
.class_list_wrap .img i					{display:grid; align-items:center; height:100%; position:absolute; width:100%; color:#fff;background:rgba(0,0,0,0.3); z-index:1; text-align:center; font-size:2.6em;}
.class_list_wrap .tit					{font-family: 'S-Core Dream'; font-size:1.1em; color:#111; font-weight:500; letter-spacing:-0.75px; margin-bottom:15px;}
.class_list_wrap .tit span				{margin-right:15px;}
.class_list_wrap .info					{padding-top:10px;}
.class_list_wrap .info ul				{display:grid; grid-template-columns:repeat(2, 1fr); gap:3px 10px;}
.class_list_wrap .info ul li			{display:grid; grid-template-columns:90px auto;  color:#777;}
.class_list_wrap .info ul li strong		{font-family: 'S-Core Dream'; color:#333; font-size:0.9em;}
.class_list_wrap>li:hover .img img		{transform: scale(1.05);}

@media screen and (max-width:1024px) {
	.class_list_wrap>li				{padding:15px 0;}
	.class_list_wrap>li a			{display:block;}
	.class_list_wrap .img			{height:auto;}	
	.class_list_wrap .tit			{font-size:1.05em; margin-bottom:10px;}
	.class_list_wrap .tit span		{margin-right:7px;}
	.class_list_wrap .info ul		{margin-top:10px; grid-template-columns:1fr; gap:0;}
}


/* 온라인 강의 커리큘럼 리스트 박스  ================================================================================== */
.class_curriculum_list						{position:relative; margin-bottom:60px;}
.class_curriculum_list ul					{display:grid; gap:7px;}
.class_curriculum_list ul li				{position:relative; padding:15px; border:1px solid #dfdfdf; background:#f6f7f9; display:grid; align-items:Center; grid-template-columns:40px auto 15%; gap:20px;}
.class_curriculum_list ul li .no			{text-align:center;}
.class_curriculum_list ul li .no span		{display:inline-block; font-family:'pretendard'; width:36px; line-height:36px;background:#999;color:#fff; font-size:0.9em; border-radius:2px;}
.class_curriculum_list ul li .tit			{font-family: 'S-Core Dream'; color:#333;}
.class_curriculum_list ul li .time			{text-align:center; color:#a1a1a1; }
.class_curriculum_list ul li .time i		{display:inline-block; margin-right:10px; color:#bbb;}

@media screen and (max-width:1024px) {
.class_curriculum_list ul li				{padding:10px; grid-template-columns:40px auto; gap:0 10px;}
.class_curriculum_list ul li .no			{grid-column: 1 / 2; grid-row: 1 / 3; }
.class_curriculum_list ul li .no span		{width:32px; line-height:32px;}
.class_curriculum_list ul li .time			{text-align:left; font-size:0.9em;}
.class_curriculum_list ul li .time i		{margin-right:5px;}
}


/* 마이페이지 리스트  ================================================================================== */
.dashboard_wrap													{position:relative;background:#f5f5f5;  margin:0 0 70px 0; border:1px solid #e0e0e0;  }
.dashboard_wrap .dashboard_date						{background:#eaeaea; border-bottom:1px solid #e0e0e0; padding:20px ; text-align:center; font-size:1.2em;color:#222;font-weight:700;  letter-spacing:-1px; }
.dashboard_wrap .dashboard_date	 span			{font-size:0.8em;color:#777;}
.dashboard_wrap .summary								{max-width:1200px; width:100%; margin:auto;margin-top:50px; margin-bottom:50px; display: grid; grid-template-columns: repeat(4, 1fr);  }
.dashboard_wrap .summary li								{position:relative;  padding: 0 30px;border-right:1px solid #e5e5e5;display: flex; gap:30px; } 
.dashboard_wrap .summary li:last-child				{border-right:0;} 
.dashboard_wrap .summary li .img					{position:relative;width:90px;height:90px; border-radius:50px; }
.dashboard_wrap .summary li .txt						{position:relative;flex:2; color:#333;letter-spacing:-1px;font-weight:500;line-height:1.3;}
.dashboard_wrap .summary li .no						{font-size:2em;line-height:1.3;font-weight:700;color:var(--point1);padding:10px 0 0 0;}
.dashboard_wrap .summary li .no span				{font-size:1.15rem;line-height:1.3;font-weight:700;color:var(--point1); }

.dashboard_wrap .summary li .icon01				{ background:url('./img/mypage_icon01.png') no-repeat center 50% #fff; }
.dashboard_wrap .summary li .icon02				{ background:url('./img/mypage_icon02.png') no-repeat center 50% #fff; }
.dashboard_wrap .summary li .icon03				{ background:url('./img/mypage_icon03.png') no-repeat center 50% #fff; }
.dashboard_wrap .summary li .icon04				{ background:url('./img/mypage_icon04.png') no-repeat center 50% #fff; } 

.dashboard_wrap .summary02							{ position:relative; background:#fff;}
.dashboard_wrap .summary02 ul						{position:relative;max-width:1200px; padding:35px  ;width:100%; margin:auto; display: grid; grid-template-columns: repeat(2, 1fr);  gap:60px;}
.dashboard_wrap .summary02 ul li						{color:#888;}
.dashboard_wrap .summary02 ul li p					{position:relative;color:#222; font-size:1.05em;font-weight:700;padding:0 0 10px 0; letter-spacing:-1px; }
.dashboard_wrap .summary02 ul li p:after		{position:absolute; content:''; display:block; left:-13px; top:5px; width:3px; height:15px; background:var(--point1);}
.dashboard_wrap .summary02 ul li span			{color:#000; font-size:1.2em;font-weight:700;  }
 

@media screen and (max-width:1200px) {  
.dashboard_wrap  .summary								{margin-top:30px; margin-bottom:30px; }
.dashboard_wrap .summary li								{text-align:center;  flex-direction: column;gap:10px; } 
.dashboard_wrap .summary li .img					{width:70px;height:70px;margin:auto; }
.dashboard_wrap .summary li .no						{font-size:1.8em;padding: 5px 0  0 0;}
.dashboard_wrap .summary li .icon01,
.dashboard_wrap .summary li .icon02,
.dashboard_wrap .summary li .icon03,
.dashboard_wrap .summary li .icon04				{ background-size:45px; }
}

@media screen and (max-width:800px) { 
.dashboard_wrap													{margin:0 0 60px 0;  }
.dashboard_wrap  .summary								{margin-top:20px; margin-bottom:20px; grid-template-columns: repeat(2, 1fr);row-gap:30px;  }
.dashboard_wrap .summary li								{padding: 0 10px;  } 
.dashboard_wrap .summary li .no						{display:inline-block;padding:0 0 0 10px;font-size:1.6em;}
.dashboard_wrap .summary li .no span				{font-size:1rem; }
.dashboard_wrap .summary02 ul						{padding:30px 30px 30px 50px; grid-template-columns: repeat(1, 1fr);  gap:20px;}
}
@media screen and (max-width:600px) { 
.dashboard_wrap  .summary								{ row-gap:20px;  }
.dashboard_wrap .dashboard_date	 					{padding:15px ; font-size:1.1em;}
.dashboard_wrap .dashboard_date	 span			{display:block;}
.dashboard_wrap .summary li .txt						{font-size:0.9em; }
.dashboard_wrap .summary li .no						{font-size:1.5em;}
.dashboard_wrap .summary02 ul						{padding:20px 20px 30px 30px; }
}

/* 마이페이지 리스트  ================================================================================== */ 
.mypage_list_wrap								{position:relative;  display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px;margin:0 0 50px 0;} 
.mypage_list_wrap li								{position:relative;  } 
.mypage_list_wrap li .img					{position:relative; height:200px;overflow:hidden;  transition:all 0.5s ease;}
.mypage_list_wrap li .img img			{width:100%;height:100%;object-fit:cover;transition:all 0.5s ease;}
.mypage_list_wrap li .cont					{position:relative; }
.mypage_list_wrap li .cont .tit				{position:absolute; font-size:1.1em;font-weight:600;color:#111; width:100%; padding: 15px 0 15px 0;  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mypage_list_wrap li .cont .txt			{padding:55px 0 0 0;}
.mypage_list_wrap li .cont .txt p			{position:relative;color:#838383; padding:0 0 2px 10px   ; font-size:0.9em;}
.mypage_list_wrap li .cont .txt p:after			{position:absolute; content:''; top:10px;left:2px; background:#888; width:2px; height:2px;}
 
.mypage_list_wrap li .turn					{position:absolute; z-index:11;  }
.mypage_list_wrap li .turn span			{display:inline-block;font-size:0.9em;background:#ff5544;color:#fff;line-height:33px; padding:0 13px;}  /* 시청 중 상태 */
.mypage_list_wrap li .turn .end			{background:#39bcd0;}    /* 시청 완료 상태 */
.mypage_list_wrap li .turn .app			{background:#6b94e9;}   /* 승인 상태 */
.mypage_list_wrap li .turn .wait			{background:#88c01d;}   /* 승인 대기 상태 */

.mypage_list_wrap li:hover .img img			{transform: scale(1.07);filter: brightness(0.6); } 

.mypage_list_line											{border-top:1px solid #e3e3e3;height:60px;}

@media screen and (max-width:1200px) { 
.mypage_list_wrap								{ gap:  20px;}  
}
@media screen and (max-width:1024px) { 
.mypage_list_wrap								{ grid-template-columns: repeat(2, 1fr); gap:   30px 20px;}  
.mypage_list_wrap li .cont .txt			{padding:50px 0 10px 0;}
}
@media screen and (max-width:600px) { 
.mypage_list_wrap								{ grid-template-columns: repeat(1, 1fr); }
}