/**********************
 * 概要
 **********************/
.summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap:12px;
    margin: 20px 0;
}

.summary-card {
    background: #fff;
    border: 1px solid #d9d9d9;
    border-left: 5px solid #01579B;
    padding: 12px 14px;
    box-sizing: border-box;
}

.summary-card-title {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 12px;
}

.summary-card-value {
    font-size: 1.5em;
    font-weight: bold;
    color: #333;
    line-height: 1.2;
    text-align:right;
}

/**********************
 * 費目別集計
 **********************/
.category-table{
    width:100%;
    border-collapse:collapse;
}

.category-table th,
.category-table td{
    padding:10px 12px;
    border-bottom:1px solid #ddd;
}

.category-table th{
    background:#E1F5FE;
    text-align:left;
}

.category-table .amount{
    text-align:right;
}

.category-table .total-row{
    font-weight:bold;
}

/**********************
 * 適用しなかったもの
 **********************/
.policy-list dt {
    font-weight:bold;
    margin-top:1em;
    color:#01579B;
}

.policy-list dd {
    margin-left:1em;
    line-height:1.8;
}

/**********************
 * 明細
 **********************/
.detail-table{
    width:100%;
    border-collapse:collapse;
}

.detail-table th{
    background:#E1F5FE;
    text-align:left;
    padding:12px;
}

.detail-table td{
    padding:12px;
    border-bottom:1px solid #ddd;
}

.detail-table .amount{
    text-align:right;
    white-space:nowrap;
}

.detail-box {
    margin: 1em 0;
}

.detail-box summary {
    cursor: pointer;
    font-weight: bold;
    color: #01579B;
    padding: 0.5em 0;
}

.detail-box[open] summary {
    margin-bottom: 1em;
}

/**********************
 * レスポンシブ対応
 **********************/
@media (max-width: 600px) {
    .detail-table th,
    .detail-table td {
        padding: 8px 6px;
        font-size: 0.9em;
    }

    .detail-table .amount {
        white-space: nowrap;
    }

	.detail-table td {
	    font-size:0.9em;
	}
    
    .detail-table th:first-child,
    .detail-table td:first-child {
        width: 6.5em;
    }

    .detail-table th:last-child,
    .detail-table td:last-child {
        width: 4.5em;
    }
}