/* 멀티게시판    ================================================================================== */
.news_mtab									    { position:relative;   border-bottom:3px solid var(--color1);   } 
.news_mtab ul									{ position:relative; display:flex; gap:40px; padding-bottom:20px; padding-left:5px; } 
.news_mtab ul li                               {position:relative;}
.news_mtab ul li:not(:first-of-type)::after   {position:absolute;content:''; left:-18px; top:4px; width:1px; height:1.2em;background:#ddd; }
.news_mtab .mtab_li					    { position:relative;  text-align:center;  display:block; color:#909090;   font-size:1.5em; font-family:var(--font-family-brand);  font-weight:600;   line-height:1; } 
.news_mtab .mtab_li:hover            {color:var(--color1); }
.news_mtab .on .mtab_li				    { color:var(--color1); font-size:1.8em;  font-weight:700; }  

.news_mtab .more						   {display:block; position:absolute; right:0; top:0;   }
.news_mtab .more span                  {position:absolute; right:0;  display:block; width:34px;height:34px; border-radius:30px; border:1px solid #ddd;  transition:all 0.3s ease;} 
.news_mtab .more span::after			{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); width:14px; height:2px; background:#a9a9a9;}
.news_mtab .more span::before		{position:absolute; content:''; left:50%; top:50%; transform:translate(-50%, -50%); height:14px; width:2px; background:#a9a9a9;}
.news_mtab .more:hover span::after,
.news_mtab .more:hover span::before	{ background:var(--color1);} 
.news_mtab .more:hover span                {border-color:var(--color1);}
.news_mtab .more:hover span::after		 {border-color:var(--color1);}

 

.news_item								{width:100%; }
.news_item .top						{overflow:hidden; padding:20px 7px ; border-bottom:1px solid #ddd;  }
.news_item .top a                     { display:block;display: flex; gap:30px;}
.news_item .top .date				{ width:90px;height:90px; text-align:center; line-height:1.25; font-family:var(--font-family-brand); font-weight:500;  color:#fff; font-size:0.75em; border-radius:15px;   background:var(--color1);display: flex; flex-direction: column; justify-content:center; align-items:center;  }
.news_item .top .date b			{display:block;font-weight:600; font-family:var(--font-family-brand);  font-size:2.3em; } 
.news_item dl							{ flex:2; display: flex; flex-direction: column; justify-content:center;   }
.news_item dl dt						{font-size:1.1em;   font-weight:700; color:#000; margin-bottom:10px; overflow:hidden; text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; word-wrap: break-word; }
.news_item dl dd						{color:#757575;   overflow:hidden; text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap: break-word; }
.news_item ul							{overflow:hidden;width:100%;   padding-top:18px  ;}
.news_item ul li							{ position:relative;   } 
.news_item ul a							{position:relative;   padding:5px 5px 8px 20px; line-height:1.3; display:flex;flex-flow:wrap;justify-content: space-between; gap:15px; } 
.news_item ul a::before           {position:absolute; content:''; left:7px;top:14px; width:3px; height:3px; background:#333; border-radius:3px; }
.news_item li .cate				    {position:relative; display:inline-block; border:1px solid var(--color1); border-radius:50px; padding:0 8px; text-align:center; min-width:60px;   color: var(--color1); font-size:0.85em; font-weight:500; }
.news_item li .cate2				    {border-color:var(--color3);color:var(--color3); }

.news_item li p						    {position:relative; flex:2; color:#000;font-size:1em; font-weight:500; overflow: hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;}
.news_item li .date				    {position:relative; width:110px;text-align:right;    color:#999; font-size:0.95em;  }
.news_item dl:hover,
.news_item ul a:hover              {text-decoration:underline; }



.news_item .nolist					{text-align:center; border:0; line-height:90px; }

   
/* 멀티게시판    ================================================================================== */

 
@media screen and (max-width:1024px) { 
    .news_mtab ul									{  gap:30px; padding-bottom:15px; padding-left:0;  } 
    .news_mtab ul li:not(:first-of-type)::after   {  left:-14px; top:3px; height:1.1em; }
    .news_mtab .mtab_li					{ font-size:1.4em;    } 
    .news_mtab .on .mtab_li				{   font-size:1.6em;  }  
    .news_mtab .more						{  top:-4px;}
  
    .news_item .top						{  padding:15px 0 ;  }
    .news_item .top a                     {  gap:20px;}
    .news_item .top .date				{ width:80px;height:80px; }
    .news_item .top .date b			{  font-size:2.2em; } 
    .news_item dl dt						{font-size:1.05em;margin-bottom:6px;  }
    .news_item dl dd						{font-size:0.95em ;}

    .news_item ul							    { padding-top:15px  ;}  
    .news_item ul a							{  padding:5px 5px 5px 15px ; font-size:0.95em; gap:0;}
    .news_item ul a::before           { left:3px;top:12px; }
}
@media screen and (max-width:768px) {      
    .news_mtab ul									{  gap:20px;   } 
    .news_mtab ul li:not(:first-of-type)::after   {  left:-10px; top:2px; height:1em; }
    .news_mtab .mtab_li					{ font-size:1.2em;    } 
    .news_mtab .on .mtab_li				{   font-size:1.35em;  }  
  
    .news_mtab .more span                  { width:28px;height:28px;  } 
    .news_mtab .more span::after			{ width:12px;}
    .news_mtab .more span::before		{ height:12px; }
 
}
@media screen and (max-width:480px) {    
    .news_item .top a                     {  gap:16px;}  
    .news_item .top .date				{ width:70px;height:70px; font-size:0.7em; border-radius:10px;   }
    .news_item .top .date b			{  font-size:2em; }  
    .news_item dl dt						{ font-size:1.05em;margin-bottom:0; text-overflow: ellipsis;-o-text-overflow: ellipsis; display:-webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; }
    .news_item dl dd						{display:none; } 

    .news_item li .date				    {display:none; }
}