/* 如藝印六分類 DWT 共用版型，2026-11-03：只控制外觀，內容在 DW 表格中編輯。 */
/* 放在 joyprint.css 後面載入，不直接修改舊版共用 CSS */
.jp-template .shell{width:1280px;max-width:100%;margin:0 auto;border-collapse:collapse;table-layout:fixed}
.jp-template .shell>tbody>tr>td{padding:0}
.jp-template .header-img{width:100%;height:auto;display:block}
.jp-template .navtd{background:#f6f7f8;min-height:62px;padding:16px 18px!important;position:relative;white-space:normal;height:auto}
.jp-template .navtd>a,.jp-template .jp-menu{display:inline-block;margin-right:19px;color:#222;vertical-align:middle}
.jp-template .jp-menu>summary{display:inline-block;cursor:pointer;list-style:none;color:#bc1414!important}
.jp-template .jp-menu>summary:after{content:' ▾';font-size:11px}
.jp-template .jp-dropdown{display:none;position:absolute;top:100%;left:0;width:240px;max-height:65vh;overflow:auto;z-index:9999;background:#fff;border:1px solid #ddd;box-shadow:0 5px 14px #0003;padding:5px}
.jp-template .jp-menu[open]>.jp-dropdown{display:block}
.jp-template .jp-dropdown a{display:block;padding:7px 12px;white-space:nowrap;color:#333}
.jp-template .jp-dropdown .menu-separator{height:1px;background:#ddd;margin:4px 0}
.jp-template .jp-banner{position:relative;width:100%;overflow:hidden;background:#f7f9fc}
.jp-template .jp-banner img{display:block;width:100%;height:auto;max-height:none;object-fit:fill}
.jp-template .jp-banner-copy{position:absolute;left:7%;top:21%;width:44%;pointer-events:none}
.jp-template .jp-banner-copy h1{font-size:clamp(18px,2.9vw,39px);font-weight:700;line-height:1.2;color:var(--jp-cat);margin:0 0 11px}
.jp-template .jp-banner-copy p{font-size:clamp(10px,1.4vw,18px);line-height:1.55;color:#333;margin:0}
.jp-template .page-main{padding:26px 30px 38px!important;background:#fff}
.jp-template .jp-layout{width:100%;table-layout:fixed;border-collapse:collapse}
.jp-template .jp-layout .jp-primary{width:80%;padding:0 24px 0 0;vertical-align:top}
.jp-template .jp-layout .jp-aside{width:20%;padding:0;vertical-align:top}
.jp-template .section-heading{font-size:21px;color:var(--jp-cat);border-left:5px solid var(--jp-cat);margin:0 0 15px;padding-left:12px}
.jp-template .body-copy{line-height:1.85;text-align:left;margin:0 0 20px}
.jp-template .content-list{line-height:1.9;padding-left:24px;margin:0 0 22px}
.jp-template .work-table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:8px 10px}
.jp-template .work-cell{width:33.333%;padding:8px;border:1px solid #dedede;vertical-align:top;text-align:center;background:#fff}
.jp-template .work-image{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#f3f5f7;display:block}
.jp-template .work-title{text-align:center;margin:8px 0 4px;line-height:1.5;font-size:14px}
.jp-template .sidebar-card{padding:14px;border:1px solid #e2e6eb;background:#fafafa;margin:0 0 15px}
.jp-template .sidebar-card h2{font-size:17px;margin:0 0 10px;font-weight:600}
.jp-template .sidebar-card a{display:block;padding:5px 0}
.jp-template .sidebar-card p{margin:0;line-height:1.8;text-align:left}
.jp-template .footer{text-align:center;border-top:1px solid #ddd;padding:20px!important;color:#666;font-size:12px}
@media(max-width:900px){.jp-template .jp-layout,.jp-template .jp-layout>tbody,.jp-template .jp-layout>tbody>tr,.jp-template .jp-layout .jp-primary,.jp-template .jp-layout .jp-aside{display:block;width:100%!important}.jp-template .jp-layout .jp-primary{padding-right:0!important}.jp-template .jp-layout .jp-aside{margin-top:22px}.jp-template .page-main{padding:18px!important}}
@media(max-width:650px){.jp-template .jp-banner-copy{left:6%;top:19%;width:53%}.jp-template .jp-banner-copy h1{font-size:clamp(15px,4vw,22px);margin-bottom:4px}.jp-template .jp-banner-copy p{font-size:clamp(9px,2.4vw,12px)}.jp-template .work-table,.jp-template .work-table>tbody,.jp-template .work-table>tbody>tr,.jp-template .work-table .work-cell{display:block;width:100%!important}.jp-template .work-cell{margin-bottom:12px}.jp-template .navtd{padding:10px 12px!important}.jp-template .navtd>a,.jp-template .jp-menu{margin:0 10px 5px 0}}

/* JOY PRINT 共用頁尾：六大分類統一黑底白字，E-mail 仍可點擊 */
.jp-template .shell > tbody > tr > td.footer,
.jp-template .footer {
  background-color: #000000 !important;
  color: #ffffff !important;
  text-align: center !important;
  border-top: 0 !important;
  padding: 14px 12px !important;
  font-size: 14px;
  line-height: 1.65;
}
.jp-template .footer a,
.jp-template .footer a:link,
.jp-template .footer a:visited,
.jp-template .footer a:hover,
.jp-template .footer a:focus {
  color: #ffffff !important;
  text-decoration: underline;
}

/* 2026-11-03: 六個產品分類統一寬度、高度、導覽列與圖片比例 */
html{overflow-y:scroll;}
.jp-template .shell{width:1280px!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;table-layout:fixed!important;}
.jp-template .header-img{display:block!important;width:100%!important;height:64px!important;object-fit:fill!important;}
.jp-template .navtd{height:62px!important;min-height:62px!important;padding:0 18px!important;vertical-align:middle!important;}
.jp-template .jp-banner{height:250px!important;min-height:250px!important;max-height:250px!important;overflow:hidden!important;}
.jp-template .jp-banner>img{width:100%!important;height:250px!important;max-height:250px!important;object-fit:fill!important;display:block!important;}
@media(max-width:700px){.jp-template .header-img{height:auto!important;}.jp-template .navtd{height:auto!important;min-height:62px!important;padding:12px!important;}.jp-template .jp-banner{height:auto!important;min-height:0!important;max-height:none!important;}.jp-template .jp-banner>img{height:auto!important;max-height:none!important;}}
