/* reset */
#contents section {
    padding-bottom: 0;
}

.h2,
.h3 {
    margin-bottom: 0;
    letter-spacing: 0;
    line-height: 1.4;
    font-weight: 700;
}

main section p {
    margin-bottom: 0;
}

main section ul{
    margin-bottom: 0;
}

/* commmon */
.sec-inner {
    padding-top: 80px;
    padding-bottom: 80px;
    display: grid;
    row-gap: 56px;
}

@media screen and (max-width:39.9375em) {
    .sec-inner {
        padding-top: 40px;
        padding-bottom: 40px;
        row-gap: 32px;
    }
}

.mt-4{
    margin-top: 4px;
}
.mt-8{
    margin-top: 8px;
}

/* sec-1 */
.sec-1 .sec-inner {
    padding-bottom: 64px;

    @media screen and (max-width:39.9375em) {
        padding-bottom: 32px;
    }
}

/* sec-2 */
.col-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    box-sizing: border-box;
    li{
        background-color: #E7EAF3;
        display: grid;
        row-gap: 24px;
        place-content: center;
        place-items: center;
        padding: 24px 14.25px;
        border-radius: 8px;
        p{
            text-align: center;
        }
    }
}

/* sec-3 */
.sec-3{
    background-color: #E7EAF3;
}

.col-2{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    li{
        background-color: #fff;
        display: flex;
        align-items: center;
        column-gap: 24px;
        padding: 24px;
    }
}

/* sec-4 */
@media screen and (min-width: 40em) {
    .sec-4 table thead td{
        width: 50%;
    }
}


/* sec-5 */
.col-3{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    li{
        background-color: #E7EAF3;
        display: grid;
        place-content: center;
        place-items: center;
        row-gap: 8px;
        padding: 24px 16px;
        border-radius: 8px;
        position: relative;
        .icon-num{
            position: absolute;
            top: -16px;
            left: 32px;
        }
    }
}

@media screen and (max-width:39.9375em) {
.col-4 {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.col-3 {
    grid-template-columns: repeat(1, 1fr);
}
.col-2 {
    grid-template-columns: repeat(1, 1fr);
    gap: 16px;
}
}
