.news-list{
margin:0;
padding:0;
}

.news-card{

display:flex;
align-items:flex-start;

background:#fff;

border:1px solid #e8e8e8;
border-radius:10px;

padding:14px 18px;

margin-bottom:5px;

transition:
    transform .2s ease,
    box-shadow .2s ease;

}

.news-card{
transform(-2px);

box-shadow:
    0 6px 16px rgba(0,0,0,.08);

}

.news-date{

width:95px;
min-width:95px;

color:#555;

font-size:14px;
font-weight:600;

padding-top:2px;

}

.news-content{

flex:1;

min-width:0;

}

.news-tag{

display:inline-block;

padding:2px 8px;

border-radius:999px;

font-size:11px;
font-weight:700;

margin-bottom:6px;

}

.news-tag.important{
background:#fff0f0;
color:#d93025;
}

.news-tag.update{
background:#eef6ff;
color:#0066cc;
}

.news-tag.info{
background:#f4f4f4;
color:#666;
}

.news-content h3{

margin:0 0 8px 0;

font-size:17px;
font-weight:600;
line-height:1.5;

}

.news-content h3 a{

color:#333;
text-decoration:none;

}

.news-content h3 a{

color:#0066cc;

}

.news-content p{

margin:0 0 6px 0;

font-size:14px;
line-height:1.7;

color:#444;

}

.news-content p{

margin-bottom:0;

}

.news-content a{

color:#0066cc;
text-decoration:none;

}

.news-content a{

text-decoration:underline;

}

@media (max-width:768px){

.news-card{
    display:block;
}

.news-date{

    width:auto;
    min-width:auto;

    margin-bottom:8px;
}

}

/* ==========================================
   勤怠管理シリーズ
   無料体験版・資料請求ボタン
========================================== */

.kintai-cta{

    display:inline-block;

    text-align:left;

    margin:15px 0 25px;
}

/* ボタン */

.kintai-cta-btn{

    display:block;

    width:360px;          /* バナー幅に合わせて調整 */

    box-sizing:border-box;

    padding:14px 24px;

    background:#0066cc;

    color:#fff !important;

    font-size:16px;
    font-weight:700;

    text-decoration:none !important;

    text-align:center;

    white-space:nowrap;   /* 改行しない */

    border-radius:8px;

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.kintai-cta-btn:hover{

    background:#0052a3;

    transform:translateY(-2px);

    box-shadow:
        0 4px 12px rgba(0,102,204,.25);
}

/* 補足文 */

.kintai-cta-note{

    width:360px;

    box-sizing:border-box;

    margin:8px 0 0;

    font-size:13px;

    color:#666;

    line-height:1.5;
}

/* スマホ */

@media (max-width:768px){

    .kintai-cta{

        display:block;

        width:100%;
    }

    .kintai-cta-btn{

        width:100%;

        white-space:normal; /* スマホでは折返し許可 */
    }

    .kintai-cta-note{

        width:100%;
    }
}