/* 明るい背景用オーバーレイ */
#testingProcess {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative; /*::before で作るオーバーレイに position: absolute を使うため、その基準点（親要素）として必要。*/
}

#testingProcess::before {
    content: ""; /*疑似要素を表示するために必須*/
    position: absolute; /*親要素（.bg）を基準に配置*/
    top: 0;
    left: 0; /*左上から開始*/
    width: 100%;
    height: 100%; /*親要素全体を覆う*/
    background-color: #07070ccc; 
    z-index: 0; /*背景より上、コンテンツより下に配置*/
}

/*コンテンツを上に表示*/
#testingProcess > * {
    position: relative;
    z-index: 1;
}

#testingProcess .general > .midasi {
    margin-bottom: 0.5em;
}

#testingProcess .card{
    display: flex;
    flex-direction: column;
    gap: 0.6em;
    padding: 1em;
    background-color: #0f1923;
    border:2px solid #1e4d7b;
    border-left-width: 18px;
    border-radius: 0.125em;
}

#testingProcess .card b {
    color: #e0f0ff;
    font-size: 1.25em;
}

#testingProcess .card .discription {
    color: #a0b8cc;
}

#testingProcess > .general > div {
    display: grid;
    gap: 1em;
}

/* カードを階段状にずらす */
#testingProcess .card:nth-child(1) {
    margin-left: 0;
}

#testingProcess .card:nth-child(2) {
    margin-left: 1.5em;
}

#testingProcess .card:nth-child(3) {
    margin-left: 3em;
}

#testingProcess .card:nth-child(4) {
    margin-left: 4.5em;
}
