JSFiddle - React, Tailwind, and code Playground

HTML

<div class="checkBox">
    1
    <input type="checkbox" />
    <div>
        1.1
        <input type="checkbox" />
        1.2
        <input type="checkbox" />
        <div>
            1.2.1
            <input type="checkbox" />
        </div>
    </div>
    2
    <input type="checkbox" />
    <div>
        2.1
        <input type="checkbox" />
        2.2
        <input type="checkbox" />
        <div>
            2.2.1
            <input type="checkbox" />
        </div>
    </div>
</div>

CSS

div {
    display: none;
}

.checkBox {
    display: block;
}

input[type*="checkbox"]:checked ~ div:first-of-type {
    display:block;
}