[CSS] Set up media queries for various device widths

{
    /* Smart phone (portrait) */
}
@media screen and (min-width: 500px) {
    /* Smart phone (landscape) */
}
@media screen and (min-width: 768px) {
    /* Tablet */
}
@media screen and (min-width: 1024px) {
    /* PC */
}
@media screen and (min-width: 1200px) {
    /* PC large */
}

{
    /* PC large */
}
@media screen and (max-width: 1199px) {
    /* PC */
}
@media screen and (max-width: 1023px) {
    /* Tablet */
}
@media screen and (max-width: 767px) {
    /* Smart phone (landscape) */
}
@media screen and (max-width: 499px) {
    /* Smart phone (portrait) */
}