@charset "utf-8";
/* facility.html用のCSS */
div.machine {
    max-width: 650px;
     margin: 60px auto;
}

div.machine:first-of-type {
    margin-top: 25px;
}

div.machine p {
    min-width: 300px;
}

p.faciliityName {
    font-size: 20px;
    margin: 10px auto;
}

div.machine:last-of-type {
    margin-bottom: 120px;
}

/* デスクトップ表示用 */
@media screen and (min-width: 768px) {
    /* マシンの画像と説明文を横並びにする */
    div.machine {
        max-width: 80vw;
        display: flex;
        justify-content: center;        
    }
    
    div.machine img,
    div.machne div {
        width: calc(100% / 2);    /* 画面幅に応じた画像サイズとする */
        height: auto;
        max-width: 580px;
    }
    
    div.machine p {
        margin-left: 20px;    /* flex表示時は左揃えにする */
        text-align: left;
    }
}