@charset "utf-8";

/* CSS Document */
main,
main * {
    box-sizing: border-box;
}

main .w1100  {
    max-width: 1100px;
}

p {
    font-size: clamp(12px, 0.9vw, 16px);
}

p.thanks {
    text-align: center;
    padding: 3em 0;
}

h2 {
    padding-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: clamp(18px, 1.6vw, 30px);
    margin-bottom: 1em;

    p {
        font-size: inherit;
        margin-left: 1em;
        font-weight: bold;
    }
}

.hero {
    padding: 5em 0 6em;
    background: #f0f0f0;
    h2 {
        padding: 0;
        margin: 0;
        display: block;
        font-weight: bold;
        text-align: center;
        &:after {
            content:"";
            display: block;
            margin: 0.25em auto 0;
            width: 4em;
            height: 3px;
            background: linear-gradient(to right, #211a49, #211a49 50%, #e83a22 50%, #e83a22);
        }
    }
}

@media screen and (max-width: 767px) {
    p {
        font-size: clamp(14px, 3.5vw, 28px);
    }

    h2 {
        font-size: clamp(18px, 5.5vw, 30px);

        .ico {
            width: 12.5vw;
        }

        p {
            margin-left: 0.5em;
        }
    }
}