@charset "utf-8";
/* =========================================================
   RWD 響應式樣式 (2026/10 新增)
   只在螢幕寬度 960px 以下生效，電腦版外觀完全不變。
   ========================================================= */

/* ---- 頁面主標題 H1（取代原本的 H3/H2，外觀與原本相同） ---- */
#main h1.page-title{
  font-size:130%;color:#0b9fbf;font-weight:bold;
  margin:0 0 0.8em 0;padding:0
}
/* 只給螢幕閱讀器與搜尋引擎讀取的文字 */
.sr-only{
  position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
}

/* 手機選單按鈕：電腦版隱藏 */
.menu-toggle{display:none}
.table-hint{display:none}

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

  html,body{overflow-x:hidden}
  body{font-size:14px;-webkit-text-size-adjust:100%}
  img{max-width:100%;height:auto}

  /* ---- 外框寬度 ---- */
  #wrapper,#header,#main,#footer .bg{width:auto !important}
  #main .content{width:auto;padding:15px 16px}
  #main{margin-top:15px}

  /* ---- 頁首 / 選單 ---- */
  #header{height:auto;background-size:auto 100%}
  .menu-toggle{
    display:block;width:100%;margin:0;padding:12px 16px;border:0;
    background:#006699;color:#fff;font-size:16px;font-weight:bold;text-align:left;
    font-family:"微軟正黑體","Microsoft JhengHei",Arial,sans-serif;cursor:pointer
  }
  .menu-toggle .bar{float:right;font-size:20px;line-height:1}
  #header ul#menu{display:none !important;width:auto;height:auto;margin:0;background:#fff;border-bottom:2px solid #006699}
  body.menu-open #header ul#menu{display:block !important}
  #header ul#menu li{float:none;display:block}
  #header ul#menu li a,
  #header ul#menu li a.current,
  #header ul#menu li:first-child a,
  #header ul#menu li:last-child a{
    float:none;width:auto;height:auto;padding:12px 16px;text-align:left;
    border:0;border-bottom:1px solid #e3e3e3;background-image:none
  }
  #header ul#menu li a.current{background:#eef7fa}

  /* ---- Banner 輪播 ---- */
  #header .advbox{width:auto;height:auto;margin-top:0}
  ul#portfolio{width:100%;overflow:hidden}
  ul#portfolio li{width:100%}
  ul#portfolio li img{width:100%;display:block}
  /* 標語條：維持電腦版原尺寸，再由 responsive.js 依輪播圖寬度等比例縮放，
     讓 bg_gray.jpg + awards.gif + 文字 準確蓋在輪播圖底部原本的文字上 */
  #header .advbox{position:relative}
  .awardbox{
    position:absolute;top:auto;bottom:0;left:0;
    width:369px;height:50px;padding:15px 0 0 20px;margin:0;font-size:12px;
    background-image:url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAPAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABgQEBAUEBgUFBgkGBQYJCwgGBggLDAoKCwoKDBAMDAwMDAwQDA4PEA8ODBMTFBQTExwbGxscHx8fHx8fHx8fHwEHBwcNDA0YEBAYGhURFRofHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8f/8AAEQgAQQGFAwERAAIRAQMRAf/EAE4AAQEBAQAAAAAAAAAAAAAAAAEABAgBAQAAAAAAAAAAAAAAAAAAAAAQAQEAAAAAAAAAAAAAAAAAAAABEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwDqGgAACgAAAAABAAAAACAAAQIEBBAQIEEBAgQIECBAgQIECBBAQIEEBAggQIGcAAAAAAAAAoAEAAAAQAACBAgIICBAggIECBgECBAgQIECBAggIECCAggQIGcAAAAAAAAAAAgAAACAAAQIEBBAQIEEBAgQIGAQIECBAgQIEEBAggIEECBAzgAAAAAAAAAIAAAAAQAACBAgIICBAggIECBAwCBgECBAgQIEEBAgQQEECBAz0AAAUAAAAAAAACAAAAIACBAgIICBAggIECBAgQIEDAIECBAggIECCAggQIGcAAAAAAAAAAAgAAAABAAQIEBBAQIECCAgQIECBAgQIECBAggIECCAggQIGcAAAAAAAAAAAAQAAABAAQIEBAggIECCAgQIECBAgQIECBgEEBAgQQEECBAzgAAAAAAAAAAACAAAAIACBAgIEEBAgQIICBAwCBgEDAIECBAgQQECCAggQIECBAgQIECBAgQIECBAgQIECBAgQIECBAgQIECBAgQIECBAgQIECBAgQIED/9k=");background-repeat:no-repeat;
    -webkit-transform-origin:0 100%;transform-origin:0 100%
  }

  /* ---- 內文 ---- */
  #main .content p{text-align:left;letter-spacing:0.05em}
  #main .picbox,#main .picbox1{float:none;margin:0 0 15px 0;text-align:center}
  #main .picbox ul,#main .picbox1 ul{display:block}
  #main .picbox1 table{width:100% !important}
  #main h1.page-title img,#main h3 img{vertical-align:middle}
  .item-comp-text{font-size:13px}
  .item-comp.indent{display:none}           /* 電腦版用全形空白排版的縮排，手機版隱藏 */

  /* 產品規格表：可左右滑動 */
  .table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:10px}
  .table-scroll > table{min-width:640px}
  .table-hint{display:block;font-size:12px;color:#888;margin:6px 0}

  /* 單張規格大圖 */
  table[cellpadding="50"]{width:100% !important;height:auto !important}
  table[cellpadding="50"] td{padding:0 !important;width:auto !important}

  /* 精選推薦 */
  #cornerline ul{display:block}
  #cornerline ul li{width:30%;margin:0 1.5% 0 1.5%;padding:2px 0 15px;float:left}
  #cornerline ul li:nth-child(3n+1){clear:left}

  /* 線上諮詢浮動圖示縮小 */
  #adv{width:80px;bottom:12px;right:8px}

  /* ---- 頁尾 ---- */
  #footer{height:auto;background:#eef4f6;padding:15px 0 100px}
  #footer .bg{height:auto;background-image:none;padding:0 16px;overflow:hidden}
  #footer .link{float:none;margin:0 0 10px;line-height:2}
  #footer p{float:none;width:auto;margin-top:0;color:#444;font-size:13px;line-height:1.8}
  #footer p a{color:#006699}
}

@media screen and (max-width:480px){
  #cornerline ul li{width:47%;margin:0 1.5%}
  #cornerline ul li:nth-child(3n+1){clear:none}
  #cornerline ul li:nth-child(2n+1){clear:left}
}