.about-title,
    .advantage-title {
        font-family: 'Noto Sans TC', 'Noto Sans SC', sans-serif;
        font-size: 16px;
        font-weight: bold;
        color: white;
        padding: 4px 20px;
        background: linear-gradient(to bottom, #7093BA 0%, #6382A5 100%);
        border-bottom: 2px solid #6382A5;
        border-radius: 2px;
        height: 30px;
        padding-left: 30px;
        padding-top: 10px;
    }

    .contact-image-rwd {
        display: none;
    }

    .contact-web,
    .contact-phone {
        float: left;
        width: 30%;
        padding: 10px;
    }

    .contact-image {
        float: left;
        padding: 20px 50px 0;
    }

    .contact-image img,
    .contact-image-rwd img {
        border: 0px;
    }

    .content-title {
        clear: both;
        padding: 10px;
    }

    .content-intro,
    .advange-content {
        padding: 10px;
    }

    /* 英文品名比中文長很多（最長的是 MA(A) AEC-Q200 Series Metal Alloy
       Low-Resistance），沿用中文版的 30% 會有 9 項折成兩行、且折行後那半句
       會凸到項目符號左邊，很難看。兩欄各加寬到 36%、縮小左邊 padding，
       多吃掉的水平空間由下面 .catalog-image 的 padding-left 補回來。 */
    .catalog-1,
    .catalog-2 {
        float: left;
        width: 36%;
        padding-left: 6px;
    }

    /* ul 的預設縮排（bootstrap 給的 margin-left: 25px）會再吃掉一截字元
       寬度，收到 14px 才排得下最長那一項。 */
    .catalog-1 ul,
    .catalog-2 ul {
        margin-left: 14px;
    }

    .catalog-1 ul li,
    .catalog-2 ul li {
        list-style-image: url("/images/icon/sq02.gif");
    }

    .catalog-image {
        float: left;
        padding-left: 10px;
    }

    .catalog-image img {
        border: 0px;
    }

    .wrapper-advantage {
        clear: both;
    }

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

        .contact-image,
        .catalog-image {
            padding: 20px;
        }

        /* 這個斷點下內容區收窄到約 700px，兩欄維持 36% 會有 6 項又開始折行。
           加寬到 44% 讓 30 項全部維持一行，產品照則自然掉到兩欄下方自成一列
           ——照片換行比品名折行好看，而且不會溢出容器。 */
        .catalog-1,
        .catalog-2 {
            width: 44%;
        }
    }

    @media screen and (max-width: 500px) {
        .contact-image-rwd {
            display: block;
            padding: 20px 10px 0;
        }

        .contact-image {
            display: none;
        }

        .contact-web,
        .contact-phone,
        .catalog-1,
        .catalog-2 {
            float: none;
            width: auto;
            padding: 10px 20px;
        }

        .content-title {
            padding: 10px 20px 10px;
        }

        .content-intro,
        .catalog-1,
        .catalog-2 {
            padding: 0 20px;
        }

        .catalog-image {
            padding-left: 50px;
        }

        .advange-content {
            padding: 10px 20px 0;
        }

    }
.content-title span
{
	text-decoration: underline;
}