/* 記事ページのスタイル */
.article-container {
    width: 60%;
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
}

.article-category {
    padding: 5px 10px;
    background-color: #f5f5f5;
    border-radius: 4px;
    display: inline-block;
}

.category-label {
    font-weight: bold;
    margin-right: 5px;
}

.category-name {
    color: #0066cc;
}

/* 記事コンテンツのスタイル調整 */
.card-body {
    font-size: 16px;
    line-height: 1.6;
}

/* 以下のスタイルを追加して、ホバーエフェクトを無効化 */
.card:hover {
    transform: none !important;
    box-shadow: none !important;
    transition: none !important;
}

/* カードヘッダーとカードボディのレイアウト設定 */
.card-header, 
.card-body {
    width: 100% !important;
    max-width: 100% !important;
    padding: 1.5rem !important;
}

/* 記事の内容の余白調整 */
.card-body {
    padding-top: 1.5rem !important;
    padding-bottom: 2rem !important;
}

/* スマホ対応 */
@media (max-width: 768px) {
    .article-container {
        width: 95%;
    }
}

/* 最大優先度でカード幅を設定 */
html body .article-container .card,
body .card,
.card {
    width: 100% !important;
    max-width: none !important;
    min-width: 100% !important;
}

/* カードの内部コンテンツも幅を確保 */
.card > .card-header,
.card > .card-body,
.card > .card-footer {
    width: 100% !important;
    max-width: none !important;
}

/* KD */
.answerBtnWrap{padding:0.4vw 0 0.8vw;}
.yesBtn, .noBtn{width:4vw;padding:0.2vw 0;border:0.01vw solid var(--Black);border-radius:0.4vw;}
.yesBtn:hover, .noBtn:hover{color:var(--Gray-999);}
.yesBtn{margin-right:0.2vw;}
/* KD */