/* style.css */
/* bodyの背景色指定 */
body {
    background-color: aquamarine;
}

/* ::contentクラスの横幅、背景色の指定 */
.content {
    width: 1000px;
    height: 400px;
    margin: auto;
    background-color: blue;
    padding: 10px;
    border-radius: 5px;
}

/* 横幅に応じたルールの切り替え */
/* PC */
@media screen and (width > 1024px) {
    .content {
        width: 80%;
        background-color: chartreuse;
    }
}

/* Tablet(768-1024) */
@media screen and (width > 1024px) {
    .content {
        width: 90%;
        background-color: darkgreen;
    }
}

/* mobile(<768) */
@media screen and (width < 768px) {
    .content {
        width: 95%;
        background-color: crimson;
        /* 文字のサイズを1.5倍に */
        font-size: 1.5m;
    }
}