/* 공통  ================================================================================== */ 
.glikebtn								{position:relative;cursor:pointer;user-select: none;} 
.glikebtn::before						{font-weight: 400; font-family:"Font Awesome 6 Free";content:"\f004";padding-right:10px;}
.glikebtn.on::before					{font-weight: 900;} 

.glikebundle							{position:relative;cursor:pointer;user-select: none;} 
.glikebundle::before					{font-weight: 400; font-family:"Font Awesome 6 Free";content:"\f004";padding-right:10px;}
.glikebundle.on::before					{font-weight: 900;}



/* 리스트  ================================================================================== */ 
.class_list_wrap							{display:grid; grid-template-columns:repeat(3, 1fr); gap:30px;} 
.class_list_wrap li							{position:relative; border:1px solid #ddd; border-radius:20px; overflow:hidden; transition:all 0.3s ease;}
.class_list_wrap li em						{position:absolute; left:0; bottom:0; z-index:1;}
.class_list_wrap li em span					{border-radius:0 5px 0 0 !important; line-height:34px; padding:0 15px; border:0;}
.class_list_wrap li .img					{position:relative; aspect-ratio:6 / 4; overflow:hidden; transition:all 0.5s ease;}
.class_list_wrap li .img img				{width:100%;height:100%;object-fit:cover;transition:all 0.5s ease;}
.class_list_wrap li .cont					{padding:25px 30px;}
.class_list_wrap li .cont .tit				{font-family:'Paperlogy'; font-size:1.2em; letter-spacing:0; font-weight:500; color:#000; margin-bottom:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.class_list_wrap li .txt p					{display:grid; grid-template-columns:45px auto; margin:2px 0; color:#666; font-size:0.95em;}
.class_list_wrap li .txt strong				{font-family:'Paperlogy'; color:#222; font-weight:500; letter-spacing:.5px;}
.class_list_wrap li .part					{display:grid; grid-template-columns:20px auto; font-family:'Paperlogy'; font-size:0.9em; line-height:1.45; color:var(--color1); font-weight:500; letter-spacing:0; margin-top:12px;}
.class_list_wrap li .part i					{margin:5px 5px 0 0;}
.class_list_wrap li:hover					{box-shadow:0 0 15px 1px rgba(0,0,0,0.07);}
.class_list_wrap li:hover .img img			{transform: scale(1.07);} 


@media screen and (max-width:1024px) {
	.class_list_wrap				{grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); gap:1.5em;}
	.class_list_wrap li .cont		{padding:20px;}		
	.class_list_wrap li .cont .tit	{font-size:1.1em; margin-bottom:7px;}
	.class_list_wrap li .txt p		{grid-template-columns:40px auto; margin:0;}
	.class_list_wrap li .part		{margin-top:10px;}
}