@charset "utf-8";

/* CSS Document */



article > h1 {

    width: 950px;

    margin: 60px auto 70px;

    text-align: center;

}



article ul {

    width: 1280px;

    margin-bottom: 60px;

    font-size: 0;

}

article li {

    display: inline-block;

}



@media screen and (max-width: 767px) {

    article > h1 {

        width: 90%;

        margin: 0% auto 8%;

    }



    article ul {

        display: flex;

        flex-wrap: wrap;

        width: 100%;

        margin-bottom: 6%;

    }



    article li:nth-of-type(1) {

        order: 1;

    }

    article li:nth-of-type(2) {

        order: 2;

    }

    article li:nth-of-type(3) {

        order: 4;

    }

    article li:nth-of-type(4) {

        order: 3;

    }

    article li:nth-of-type(5) {

        order: 6;

    }

    article li:nth-of-type(6) {

        order: 7;

    }

    article li:nth-of-type(7) {

        order: 5;

    }

    article li:nth-of-type(8) {

        order: 9;

    }

    article li:nth-of-type(9) {

        order: 8;

    }

    article li:nth-of-type(10) {

        order: 11;

    }

    article li:nth-of-type(11) {

        order: 10;

    }

    article li:nth-of-type(12) {

        order: 13;

    }

    article li:nth-of-type(13) {

        order: 12;

    }

    article li:nth-of-type(14) {

        order: 14;

    }

    article li:nth-of-type(15) {

        order: 15;

    }

    article li:nth-of-type(16) {

        order: 16;

    }

    article li:nth-of-type(17) {

        order: 17;

    }

    article li:nth-of-type(18) {

        order: 19;

    }

    article li:nth-of-type(19) {

        order: 18;

    }

    article li:nth-of-type(20) {

        order: 20;

    }

}