/*********************************************************************
 トップページ設定
*********************************************************************/

/* ページ一覧
====================================================================*/
.page{
 border: var(--site-bor-color) solid 1px;
}
.page-heading{
 display: flex;
 align-items: center;
 grid-column-gap: 8px;
 padding: 16px;
 border-bottom: var(--site-bor-color) solid 1px;
}
.page-in{
 padding: 16px;
}
.page-list{
 display: grid;
 grid-template-columns: minmax(0,auto);
 grid-template-rows: auto;
 grid-row-gap: 16px;
 flex: 1;
}
.page-item-wrap:hover{
 opacity: .75;
}
@media screen and (min-width: 576px){
.page-list{
 grid-template-columns: repeat(2, 1fr);
 grid-column-gap: 16px;
}
}@media screen and (min-width: 768px){
}@media screen and (min-width: 992px){
.page-list{
 grid-template-columns: repeat(3, 1fr);
}
}@media screen and (min-width: 1200px){
}@media screen and (min-width: 1400px){
}
.page-item-ttl{
 margin-top: 4px;
}

/* 新着情報
====================================================================*/
.information{
 border: var(--site-bor-color) solid 1px;
}
.information-heading{
 display: flex;
 align-items: center;
 grid-column-gap: 8px;
 padding: 16px;
 border-bottom: var(--site-bor-color) solid 1px;
}
.information-in{
 padding: 16px;
}
.information-item{
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 4px 8px;
 padding: 16px 0 8px;
 border-bottom: var(--site-bor-color) dotted 1px;
}
.information .btn{
 max-width: 300px;
 height: 48px;
 margin: 16px auto 0;
 line-height: 48px;
 border-radius: 4px;
}
.information-status{
 display: inline-grid;
 place-items: center;
 height: 24px;
 line-height: 24px;
 padding: 0 4px;
 font-size: 1.4rem;
 font-size: clamp(1.4rem, 1vw, 1.6rem);
 font-weight: bold;
 color: #FFF;
}
.information-status.published{background-color: #9acd32;}
.information-status.modified{background-color: #eec22e;}