/* 製品情報セクションのスタイリング */
.product-info {
    margin-top: 40px;
    border-radius: 10px; /* 角を丸く */
    padding: 20px; /* 内側の余白 */
    max-width: 1200px; /* 最大幅を設定 */
}

main{
    margin-top: 70px;
    padding: 50px;
}
/* 製品画像と詳細図のスタイル */
/* Styles for product image and diagrams */
.product-image, .detailed-diagram, .system-diagram {
    max-width: 70%; /* Width reduced to 60% */
    height: auto;
    margin: 20px auto; /* Centers the image and provides space around */
    display: block;
}

/* h2とh3の見出しスタイル */
h2, h3 {
    text-align: center; /* 中央寄せ */
    color: #333; /* 文字色 */
    margin-bottom: 15px; /* 下部のマージン */
}

/* パラグラフのスタイル */
p {
    font-size: 16px; /* フォントサイズ */
    line-height: 1.6; /* 行間 */
    text-align: justify; /* テキストを均等に分布 */
    margin-bottom: 20px; /* 下部のマージン */
    color: #555; /* 文字色 */
}

/* フッターのスタイル */

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
    .product-info {
        margin-top: 20px; /* スマートフォンでは余白を減らす */
        padding: 10px; /* 内側の余白を減らす */
    }
    .product-image, .detailed-diagram, .system-diagram {
        max-width: 95%;
    }
}