@charset "utf-8";
/* CSS Document */
/*-----
news
------*/
/*newslist*/
#newslist .news-list{display: -webkit-grid; display: grid;grid-template-columns:3fr 1fr;justify-content: space-between;	grid-column-gap:4rem; padding:15px 2rem; padding-bottom:2rem; margin-bottom:4rem; border-bottom:#ccc solid 1px;}
#newslist h2{padding:2rem 0;text-align:left;}
#newslist a{ text-decoration:none; overflow:hidden;}
#newslist p{word-wrap:break-word;word-break:break-all; margin-bottom:1rem; margin-top:2rem;}
#newslist em{color:#f6612c;}	
#newslist .box-line{ width:5%; height:5px;  background-color:var(--web-theme-color-red); transition: all .3s ease-in-out; overflow:hidden;} 
#newslist a:hover .box-line{ width:100%;}
#newslist a img{ width:100%;   transition: all .6s ease-in-out;}
#newslist a:hover img{-webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1);}
#newslist a:hover h2{color:var(--web-theme-color);}
/*-----
newsdeail
-------*/
#news-content{ padding-bottom:12rem;}
#news-content .sy-container{ max-width:1000px;}
#news-content .grid{grid-template-columns:repeat(3,auto);}
#news-content  h2,.newsview-name{text-align:center;color:#333;}
.SiteLink  p{margin-top:10px;margin-bottom:20px;}
.SiteLink a{color:var(--web-theme-color);}
.SiteLink  a:hover{text-decoration:underline;}
.newsview-name{font-size:1.6em;}
.newsview-time{color:#787878;text-align:center;margin-top:2rem;margin-bottom:2.5rem;padding-bottom:1em;border-bottom:#eeeeee solid 2px;}
.news-link{display: -webkit-grid; display: grid; grid-template-columns:repeat(3,auto); grid-column-gap:4rem; margin-top:4rem;}
.news-link img{ width:100%; margin:0 auto;}
.news-link a{ text-decoration:none;}
.news-link a:hover h4{color:var(--web-theme-color);}
.news-link a:hover  img{opacity:0.6;}
.news-link h4{ padding-top:2rem; text-align:center; color:#333; }
/*mobile phone*/
@media (max-width:1023px){
#newslist{ padding-top:2rem;} 	
#newslist .news-list{grid-template-columns:1fr; grid-column-gap:0;grid-row-gap:2rem; padding-bottom:8rem;}
#newslist .wrap-flex{flex-direction: column;}
#newslist .news-item:last-child{ padding-top:4rem;}
#newslist .news-itemimg img{ width:16%;}
/*newsdeail*/
#news-content{ padding-top:4rem; padding-bottom:12rem;}
#news-content .grid{grid-template-columns:auto; grid-row-gap:4rem;}
.newsview-name{font-size:3rem; font-weight:600; line-height:1.2em;}
}