/*  리스트  ==================================================================================== */
.garden_list							{position:relative; display: grid; grid-template-columns: repeat(3, 1fr); gap:40px  ;transition: all 0.3s ease;}
.garden_list:after					{content:""; display:block; clear:both;}

.garden_list li							{position:relative;}
.garden_list figure					{position:relative; height:250px; border:1px solid #e5e5e5;  overflow:hidden;}
.garden_list figure img			{width:100%; height:100%; object-fit:cover; transition: all 0.4s ease;}
.garden_list .tit						{font-size:1.2em; color:#222; font-weight:600; letter-spacing:-1px; margin:20px 10px 15px 10px;}
.garden_list .tit span				{margin-right:25px; font-size:17px; display:inline-block; background:#a9cd3a; color:#fff; padding:5px 0; width:75px; text-align:center; border-radius:50px;}
.garden_list dl						{position:relative; display: grid; grid-template-columns:40px auto;  padding:3px 10px    ;  } 
.garden_list dl dt i					{position:relative; background:#a9cd3a; color:#fff; width:30px;height:30px; line-height:30px; text-align:center; border-radius:100%; font-size:14px; }
.garden_list dl dd					{position:relative; color:#666;font-size:0.9em; padding:5px 0 0 0; line-height:1.4;}
 
.garden_list dl.product dd		{height:30px;overflow:hidden;text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical; word-wrap: break-word; } 

.garden_list li:hover figure	{box-shadow:0 5px 8px rgba(0, 0, 0, 0.2);}
.garden_list li:hover figure img	{transform: scale(1.05);}
.garden_list .link					{position:absolute; right:15px; bottom:20px; z-index:111;}
.garden_list .link i					{width:52px; line-height:52px; font-size:20px; background:#a9cd3a; color:#fff; text-align:center; border-radius:100%; }
.garden_list .link:hover i		{background:#000;}

@media screen and (max-width:1300px) { 
.garden_list							{  gap:30px  ;} 
}
@media screen and (max-width:1024px) {
	.garden_list						{grid-template-columns: repeat(2, 1fr); gap:30px 20px;}
	.garden_list figure				{height:180px;}
	.garden_list .tit					{font-size:1.15em;} 
	.garden_list .link				{bottom:10px; right:10px;}
	.garden_list .link i				{width:42px; line-height:42px; font-size:0.85em;}
}

@media screen and (max-width:768px) {
	.garden_list						{grid-template-columns:none; gap:20px 0;}
}


/*  뷰  ==================================================================================== */
.garden_viewtop 									{position:relative; display: grid; grid-template-columns:43% auto; gap:60px;   border-bottom:1px solid #ddd; padding:10px 0 40px 0; margin-bottom:40px;}
.garden_viewtop figure						{ border:1px solid #eaeaea;   overflow:hidden;}
.garden_viewtop figure img					{width:100%; height:100%; object-fit:cover;}
.garden_viewtop .inner						{ }
.garden_viewtop .inner .tit					{font-family: 'S-CoreDream-6Bold'; font-size:1.7em; letter-spacing:-1.5px; color:#333; padding:15px 0 25px 0;}
.garden_viewtop .inner .cont				{background:#f7f7f7; padding:20px 25px;  color:#797979; margin:0 0 20px 0; font-size:0.95em;}
.garden_viewtop .inner ul li					{position:relative; color:#414141; padding:2px 0 0 43px; margin-bottom:12px;}
.garden_viewtop .inner ul li i				{position:absolute; top:0; left:0; background:#a9cd3a; color:#fff; width:30px; line-height:30px;font-size:14px; text-align:center; border-radius:100%;}
.garden_viewtop .inner ul li span		{font-size:0.9em; color:#1984f1; text-decoration:underline;}

.garden_viewitem								{position:relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap:20px;}
.garden_viewitem li							{position:relative;  border:1px solid #eaeaea; overflow:hidden;}
.garden_viewitem li img					{width:100%;   height: auto; transition: all 0.5s ease;}
 
 
/*

.garden_viewitem								{position:relative; display: grid; grid-template-columns: repeat(4, 1fr); gap:20px;}
.garden_viewitem li							{position:relative;  border:1px solid #eaeaea; overflow:hidden;}
.garden_viewitem li img					{width:100%;   transition: all 0.5s ease;}

.garden_viewitem li:hover				{box-shadow:0 5px 8px rgba(0, 0, 0, 0.2);}
.garden_viewitem li:hover img		{transform: scale(1.07);}
.garden_viewitem i							{position:absolute; right:0; bottom:0; width:42px; line-height:42px; text-align:center; font-size:0.9em; color:#fff; background:rgba(0, 0, 0, 0.5); z-index:1;}
*/
 
@media screen and (max-width:1024px) {
	.garden_viewtop						{padding:0 0 30px 0;grid-template-columns:1fr; gap:30px;  }
	.garden_viewtop figure			{height:auto;} 
	.garden_viewtop .inner .tit				{font-size:1.4em; padding:0 0 20px 0;}
	.garden_viewtop .inner ul li				{font-size:0.95em; margin-bottom:7px;}
	.garden_viewtop .inner .cont			{margin:0 0 15px 0; padding:15px;}
.garden_viewitem								{ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap:15px;}
 
}

@media screen and (max-width:768px) {
	.garden_viewtop						{padding:0 0 20px 0; gap:20px;  } 
	.garden_viewtop .inner .tit			{font-size:1.25em;  text-align:center;padding:0 0 15px 0;} 
 
}

@media screen and (max-width:580px) { 
	.garden_viewitem li				{height:auto;}
}


/*  검색  ==================================================================================== */
.garden_search							{overflow:hidden; margin-bottom:30px;}
.garden_search .ginfo				{float:left; padding:25px 0 0 0; }
.garden_search form					{float:right; width:45%; overflow:hidden;}    
.garden_search form fieldset		{float:right; width:calc(77% - 5px);height:50px;color:#333;line-height:50px;vertical-align:top;}
.garden_search .input_form			{box-sizing:border-box; width:calc(100% - 70px); height:48px;color:#666; vertical-align:top;border:1px solid #dfdfdf; padding:0 10px; letter-spacing:-0.75px;}
.garden_search .btns					{float:right; border:1px solid #333; background:#333; height:48px; line-height:40px; width:70px; text-align:center; color:#fff; letter-spacing:-1px;}
.garden_search .btns:hover			{background:#000;}

 
@media screen and (max-width:1024px) { 
.garden_search form					{ width:55%;  }    
 
}
/* screen 768 */
@media screen and (max-width:768px) { 
	.garden_search					{margin-bottom:20px;}
	.garden_search .ginfo			{float:none; padding:0 0 10px 0;}
	.garden_search form				{float:none; width:100%;} 
	.garden_search form fieldset				{float:none; width:100%;}
}