@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+HK:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
/*=========================

設定全域變數

===========================*/
:root {
  /* 主項目:"色彩系統" */ /* 次項目:"主色"，使用調色盤選取工具，產生主色HSL */
  --isd-color-1st-hue: 200; /* 自訂覆寫:主色 hue 值 */
  --isd-color-1st-saturation: 65%; /* 自訂覆寫:主色 saturation 值 */
  --isd-color-1st-lightness: 45%; /* 自訂覆寫:主色 lightness 值 */
  --isd-color-1st: hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),var(--isd-color-1st-lightness));
  --isd-color-1st-100: color-mix(in hsl,var(--isd-color-1st) 20%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),100%) 80%);
  --isd-color-1st-200: color-mix(in hsl,var(--isd-color-1st) 40%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),100%) 60%);
  --isd-color-1st-300: color-mix(in hsl,var(--isd-color-1st) 60%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),100%) 40%);
  --isd-color-1st-400: color-mix(in hsl,var(--isd-color-1st) 80%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),100%) 20%);
  --isd-color-1st-500: var(--isd-color-1st);
  --isd-color-1st-600: color-mix(in hsl,var(--isd-color-1st) 80%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),0%) 20%);
  --isd-color-1st-700: color-mix(in hsl,var(--isd-color-1st) 60%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),0%) 40%);
  --isd-color-1st-800: color-mix(in hsl,var(--isd-color-1st) 40%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),0%) 60%);
  --isd-color-1st-900: color-mix(in hsl,var(--isd-color-1st) 20%, hsl(var(--isd-color-1st-hue),var(--isd-color-1st-saturation),0%) 80%);
  /* 主項目:"色彩系統" */ /* 次項目:"搭配色"，使用調色盤選取工具，產生搭配色HSL */
  --isd-color-2nd-hue: 120; /* 自訂覆寫:主色 hue 值 */
  --isd-color-2nd-saturation: 40%; /* 自訂覆寫:主色 saturation 值 */
  --isd-color-2nd-lightness: 55%; /* 自訂覆寫:主色 lightness 值 */
  --isd-color-2nd: hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),var(--isd-color-2nd-lightness));
  --isd-color-2nd-100: color-mix(in hsl,var(--isd-color-2nd) 20%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),100%) 80%);
  --isd-color-2nd-200: color-mix(in hsl,var(--isd-color-2nd) 40%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),100%) 60%);
  --isd-color-2nd-300: color-mix(in hsl,var(--isd-color-2nd) 60%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),100%) 40%);
  --isd-color-2nd-400: color-mix(in hsl,var(--isd-color-2nd) 80%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),100%) 20%);
  --isd-color-2nd-500: var(--isd-color-2nd);
  --isd-color-2nd-600: color-mix(in hsl,var(--isd-color-2nd) 80%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),0%) 20%);
  --isd-color-2nd-700: color-mix(in hsl,var(--isd-color-2nd) 60%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),0%) 40%);
  --isd-color-2nd-800: color-mix(in hsl,var(--isd-color-2nd) 40%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),0%) 60%);
  --isd-color-2nd-900: color-mix(in hsl,var(--isd-color-2nd) 20%, hsl(var(--isd-color-2nd-hue),var(--isd-color-2nd-saturation),0%) 80%);
  /* 主項目:"色彩系統" */ /* 次項目:"背景色"，使用調色盤選取工具，產生搭配色HSL */
  --isd-color-bg-hue: 0; /* 自訂覆寫:主色 hue 值 */
  --isd-color-bg-saturation: 0%; /* 自訂覆寫:主色 saturation 值 */
  --isd-color-bg-lightness: 98%; /* 自訂覆寫:主色 lightness 值 */
  --isd-color-bg: hsl(var(--isd-color-bg-hue),var(--isd-color-bg-saturation),var(--isd-color-bg-lightness));
  --isd-color-bg-100: color-mix(in hsl,var(--isd-color-bg) 75%, #ffffff 25%);
  --isd-color-bg-200: color-mix(in hsl,var(--isd-color-bg) 80%, #ffffff 20%);
  --isd-color-bg-300: color-mix(in hsl,var(--isd-color-bg) 85%, #ffffff 15%);
  --isd-color-bg-400: color-mix(in hsl,var(--isd-color-bg) 90%, #ffffff 10%);
  --isd-color-bg-500: var(--isd-color-bg);
  --isd-color-bg-600: color-mix(in hsl,var(--isd-color-bg) 90%, #000000 10%);
  --isd-color-bg-700: color-mix(in hsl,var(--isd-color-bg) 85%, #000000 15%);
  --isd-color-bg-800: color-mix(in hsl,var(--isd-color-bg) 80%, #000000 20%);
  --isd-color-bg-900: color-mix(in hsl,var(--isd-color-bg) 75%, #000000 25%);
  --isd-color-bg-linear: linear-gradient(30deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 100%);
  --isd-color-bg-linear-100: linear-gradient(-20deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 40%);
  --isd-color-bg-linear-200: linear-gradient(-20deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 55%);
  --isd-color-bg-linear-300: linear-gradient(-20deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 70%);
  --isd-color-bg-linear-400: linear-gradient(-20deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 85%);
  --isd-color-bg-linear-500: linear-gradient(-20deg,var(--isd-color-1st) 0%, var(--isd-color-2nd) 100%);
  --isd-color-bg-linear-600: linear-gradient(-20deg,var(--isd-color-1st) 15%, var(--isd-color-2nd) 100%);
  --isd-color-bg-linear-700: linear-gradient(-20deg,var(--isd-color-1st) 30%, var(--isd-color-2nd) 100%);
  --isd-color-bg-linear-800: linear-gradient(-20deg,var(--isd-color-1st) 45%, var(--isd-color-2nd) 100%);
  --isd-color-bg-linear-900: linear-gradient(-20deg,var(--isd-color-1st) 60%, var(--isd-color-2nd) 100%);
  /* 主項目:"色彩系統" */ /* 次項目:"強調色"，使用調色盤選取工具，產生強調色HSL */
  --isd-color-highlight-hue: 208; /* 自訂覆寫:強調色 hue 值 */
  --isd-color-highlight-saturation: 100%; /* 自訂覆寫:強調色 saturation 值 */
  --isd-color-highlight-lightness: 50%; /* 自訂覆寫:強調色 lightness 值 */
  --isd-color-highlight: hsl(var(--isd-color-highlight-hue),var(--isd-color-highlight-saturation),var(--isd-color-highlight-lightness));
  --isd-color-highlight-d: color-mix(in hsl,var(--isd-color-highlight) 80%, hsl(var(--isd-color-highlight-hue),var(--isd-color-highlight-saturation),0%) 20%);
  --isd-color-highlight-l: color-mix(in hsl,var(--isd-color-highlight) 80%, hsl(var(--isd-color-highlight-hue),var(--isd-color-highlight-saturation),100%) 20%);
  /* 主項目:"色彩系統" */ /* 次項目:"文字色"，使用調色盤選取工具，產生強調色HSL */
  --isd-color-font-hue: 0; /* 自訂覆寫:文字色 hue 值 */
  --isd-color-font-saturation: 0%; /* 自訂覆寫:文字色 saturation 值 */
  --isd-color-font-lightness: 15%; /* 自訂覆寫:文字色 lightness 值 */
  --isd-color-font: hsl(var(--isd-color-font-hue),var(--isd-color-font-saturation),var(--isd-color-font-lightness));
  --isd-color-font-d: color-mix(in hsl,var(--isd-color-font) 80%, hsl(var(--isd-color-font-hue),var(--isd-color-font-saturation),0%) 20%);
  --isd-color-font-l: color-mix(in hsl,var(--isd-color-font) 80%, hsl(var(--isd-color-font-hue),var(--isd-color-font-saturation),100%) 20%);
  /* 主項目:"色彩系統" */ /* 次項目:"線條色"，使用調色盤選取工具 */
  --isd-color-line: #6e87a3; /* 自訂覆寫:線條色 RGB色值 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"字體大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-fontsize: 16px; /* 自訂覆寫:字體大小 */
  --isd-fontsize-xxl: calc( var(--isd-fontsize) * 2.5 );
  --isd-fontsize-xl: calc( var(--isd-fontsize) * 2.2 );
  --isd-fontsize-l: calc( var(--isd-fontsize) * 1.8 );
  --isd-fontsize-m: calc( var(--isd-fontsize) * 1.4 );
  --isd-fontsize-s: calc( var(--isd-fontsize) * 1 );
  --isd-fontsize-xs: calc( var(--isd-fontsize) * 0.8 );
  --isd-fontsize-xxs: calc( var(--isd-fontsize) * 0.6 );
  /* 主項目:"全域通用屬性" */ /* 次項目:"標題字粗細"，使用文字輸入框，代入初始值 */
  --isd-title-font-weight: 700; /* 自訂覆寫:標題字粗細值 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"內文字粗細"，使用文字輸入框，代入初始值 */
  --isd-content-font-weight: 400; /* 自訂覆寫:內文字粗細 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"文字行距"，使用文字輸入框，代入初始值 */
  --isd-line-hight: 1.7; /* 自訂覆寫:文字行距值 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"文字字型"，使用文字輸入框，代入初始值 */
  --isd-font-family: Arial,Helvetica,"Noto Sans TC","Microsoft JhengHei"; /* 自訂覆寫:文字字型 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"標準內間距大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-padding: 1rem; /* 自訂覆寫:標準內間距大小 */
  --isd-padding-xxl: calc( var(--isd-padding) * 2.5 );
  --isd-padding-xl: calc( var(--isd-padding) * 2 );
  --isd-padding-l: calc( var(--isd-padding) * 1.6 );
  --isd-padding-m: calc( var(--isd-padding) * 1.3 );
  --isd-padding-s: calc( var(--isd-padding) * 1 );
  --isd-padding-xs: calc( var(--isd-padding) * 0.7 );
  --isd-padding-xxs: calc( var(--isd-padding) * 0.4 );
  /* 主項目:"全域通用屬性" */ /* 次項目:"標準外間距大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-margin: 1rem; /* 自訂覆寫:標準外間距大小 */
  --isd-margin-xxl: calc( var(--isd-margin) * 2.5 );
  --isd-margin-xl: calc( var(--isd-margin) * 2 );
  --isd-margin-l: calc( var(--isd-margin) * 1.6 );
  --isd-margin-m: calc( var(--isd-margin) * 1.3 );
  --isd-margin-s: calc( var(--isd-margin) * 1 );
  --isd-margin-xs: calc( var(--isd-margin) * 0.7 );
  --isd-margin-xxs: calc( var(--isd-margin) * 0.4 );
  /* 主項目:"全域通用屬性" */ /* 次項目:"網格間距"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-gap: 1rem; /* 自訂覆寫:網格間距大小 */
  --isd-gap-xxl: calc( var(--isd-gap) * 2.5 );
  --isd-gap-xl: calc( var(--isd-gap) * 2 );
  --isd-gap-l: calc( var(--isd-gap) * 1.6 );
  --isd-gap-m: calc( var(--isd-gap) * 1.3 );
  --isd-gap-s: calc( var(--isd-gap) * 1 );
  --isd-gap-xs: calc( var(--isd-gap) * 0.7 );
  --isd-gap-xxs: calc( var(--isd-gap) * 0.4 );
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面xxl版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-xxl: 1400px; /* 自訂覆寫:xxl版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面xl版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-xl: 1200px; /* 自訂覆寫:xl版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面l版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-l: 1000px; /* 自訂覆寫:l版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面m版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-m: 800px; /* 自訂覆寫:m版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面s版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-s: 600px; /* 自訂覆寫:s版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面xs版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-xs: 400px; /* 自訂覆寫:xs版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"桌機尺寸頁面xxs版容器大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-width-xxs: 300px; /* 自訂覆寫:xxs版容器大小 */
  /* 主項目:"全域通用屬性" */ /* 次項目:"陰影強度"，使用文字輸入框，輸入0~1之間數值 */
  --isd-shadow-alpha:0.1; /* 自訂覆寫:陰影強度數值 */
  --isd-shadow-xxl: 3px 7px 7px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-xl: 3px 6px 6px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-l: 2px 5px 5px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-m: 2px 4px 4px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-s: 1px 3px 3px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-xs: 1px 2px 2px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  --isd-shadow-xxs: 0px 1px 1px 0 rgba(0,0,0,var(--isd-shadow-alpha));
  /* 主項目:"全域通用屬性" */ /* 次項目:"圓角大小"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-rounded: 1rem; /* 自訂覆寫:圓角大小 */
  --isd-rounded-xxl: calc(1rem * 2);
  --isd-rounded-xl: calc(1rem * 1.6);
  --isd-rounded-l: calc(1rem * 1.3);
  --isd-rounded-m: calc(1rem * 1);
  --isd-rounded-s: calc(1rem * 0.7);
  --isd-rounded-xs: calc(1rem * 0.4);
  --isd-rounded-xxs: calc(1rem * 0.2);
  /* 主項目:"頁首列" */ /* 次項目:"頁首列高度"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-nav-height: 60px; /* 自訂覆寫:選單列高度 */
  /* 主項目:"頁首列" */ /* 次項目:"桌機頁首列LOGO寬度"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-nav-logo-width: 100px; /* 自訂覆寫:桌機選單列LOGO寬度 */
  /* 主項目:"頁首列" */ /* 次項目:"手機頁首列LOGO寬度"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-nav-mobile-logo-width: 50px; /* 自訂覆寫:手機選單列LOGO寬度 */
  /* 主項目:"頁首列" */ /* 次項目:"頁首列背景"，使用調色盤選取工具 */
  --isd-nav-bg: #ffffff; /* 自訂覆寫:選單列背景 RGB色值 */
  /* 主項目:"頁首列" */ /* 次項目:"頁首列文字色"，使用調色盤選取工具 */
  --isd-nav-font-color: var(--isd-color-1st-700); /* 自訂覆寫:選單列文字色 RGB色值 */
  /* 主項目:"頁尾列" */ /* 次項目:"頁尾列背景"，使用調色盤選取工具 */
  --isd-footer-bg: #2b2b2b; /* 自訂覆寫:頁尾列背景 RGB色值 */
  /* 主項目:"頁尾列" */ /* 次項目:"頁尾列文字色"，使用調色盤選取工具 */
  --isd-footer-font-color: #b5b5b5; /* 自訂覆寫:頁尾列文字色 RGB色值 */
  /* 主項目:"側邊欄" */ /* 次項目:"側邊欄寬度"，使用文字輸入框，可輸入單位，代入初始值 */
  --isd-site-aside-width: 250px; /* 自訂覆寫:側邊欄寬度 */
  /* 主項目:"側邊欄" */ /* 次項目:"側邊欄背景"，使用調色盤選取工具 */
  --isd-nav-bg: #ffffff; /* 自訂覆寫:側邊欄背景 RGB色值 */
}

/*=========================

初始化

===========================*/
address, blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul, section {
  border: 0;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

main, nav {
  display: block;
}

progress {
  display: inline-block;
  vertical-align: baseline;
}

a {
  background-color: transparent;
}

a:active {
  outline: 0;
}

a, a:focus, a:hover, a:visited {
  text-decoration: none;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b, strong {
  font-weight: 700;
}

dfn {
  font-style: italic;
}

div {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 0;
}

hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code, kbd, pre, samp {
  font-size: 1em;
}

button, input, optgroup, select, textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button, select {
  text-transform: none;
}

button, html input[type=button], input[type=reset], input[type=submit] {
  -webkit-appearance: button;
  -moz-appearance: button;
       appearance: button;
  cursor: pointer;
}

button[disabled], html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type=checkbox], input[type=radio] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
  height: auto;
}

input[type=search] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
       appearance: textfield;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid;
  margin: 0 0;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

fieldset legend {
  margin-bottom: 1.5em;
  padding: 0 0.5em;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: 700;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td, th {
  padding: 0;
}

/* 以上初始化內容直接輸出不做更動 */
html {
  font-size: var(--isd-fontsize);
}

a {
  color: var(--isd-color-highlight-d);
}

a:hover, a:focus {
  color: var(--isd-color-highlight-l);
}

body, button, input, select, textarea, .isd-site-page, .isd-site-header, .isd-site-content {
  font-family: "Roboto", Arial, Helvetica, "Noto Sans HK", "Microsoft JhengHei";
  font-weight: var(--isd-content-font-weight);
  font-size: var(--isd-fontsize);
  line-height: var(--isd-line-height);
}

blockquote {
  color: var(--isd-color-font-l);
}

h1, h2, h3, h4, h5, h6, .isd-site-page :where(h1, h2, h3, h4, h5, h6) {
  font-weight: var(--isd-title-font-weight);
}

h1, .isd-site-page :where(h1) {
  padding-top: var(--isd-fontsize-xxl);
  font-size: var(--isd-fontsize-xxl);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 0.7);
  color: var(--isd-color-000);
}

h2, .isd-site-page :where(h2) {
  padding-top: var(--isd-fontsize-xl);
  font-size: var(--isd-fontsize-xl);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 0.8);
  color: var(--isd-color-000);
}

h3, .isd-site-page :where(h3) {
  padding-top: var(--isd-fontsize-l);
  font-size: var(--isd-fontsize-l);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 0.9);
  color: var(--isd-color-000);
}

h4, .isd-site-page :where(h4) {
  padding-top: var(--isd-fontsize-m);
  font-size: var(--isd-fontsize-m);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 1);
  color: var(--isd-color-000);
}

h5, .isd-site-page :where(h5) {
  padding-top: var(--isd-fontsize-s);
  font-size: var(--isd-fontsize-s);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 1);
  color: var(--isd-color-000);
}

h6, .isd-site-page :where(h6) {
  padding-top: var(--isd-fontsize-xs);
  font-size: var(--isd-fontsize-xs);
  font-weight: var(--isd-title-font-weight);
  line-height: calc(var(--isd-line-hight) * 1.1);
  color: var(--isd-color-000);
}

p {
  padding: var(--isd-padding-s) 0;
  line-height: calc(var(--isd-line-hight) * 1.2);
  text-align: justify;
}

input {
  width: 100%;
}

.isd-wp-content :is(ol, ul) {
  padding: var(--isd-padding-s) 0 var(--isd-padding-l) var(--isd-padding-l);
}
.isd-wp-content :is(ol, ul) li {
  padding-bottom: var(--isd-padding-xs);
  text-align: justify;
}
.isd-wp-content :is(ol, ul) li:last-child {
  padding-bottom: 0;
}

.body-container {
  container-type: inline-size;
  container-name: body-container;
}

.isd-site-page {
  position: relative;
  width: 100%;
}

.isd-site-header {
  position: sticky;
  width: 100%;
  background: var(--isd-nav-bg);
  z-index: 99;
  top: 0;
}

/* 修正登入後 WordPress Admin Bar 的遮擋問題 */
body.admin-bar .isd-site-header {
  top: 32px;
}

@media screen and (max-width: 782px) {
  body.admin-bar .isd-site-header {
    top: 46px;
  }
}
/* 強制手機版 Admin Bar 固定在頂部 */
@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed !important;
  }
}
.isd-site-header-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--isd-nav-height);
  padding: 0 var(--isd-padding-m);
}

.isd-site-header-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--isd-gap-m);
  z-index: 2;
}

.isd-site-header-title h2 {
  display: none;
}

.isd-site-header-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  line-height: 0;
  font-size: 0;
  max-height: var(--isd-nav-height);
}
.isd-site-header-logo .custom-logo-link {
  position: relative;
}
.isd-site-header-logo .custom-logo {
  width: var(--isd-nav-mobile-logo-width);
  height: auto;
}

@container body-container (min-width: 1024px) {
  .isd-site-header-logo .custom-logo {
    width: var(--isd-nav-logo-width);
  }
}
.isd-site-header-container::after {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: var(--isd-nav-height);
  left: 0;
  top: 0;
  border-bottom: 1px solid var(--isd-color-bg-900);
  -webkit-box-shadow: var(--isd-shadow-m);
          box-shadow: var(--isd-shadow-m);
  background: var(--isd-nav-bg);
  pointer-events: fill;
}

@container body-container (min-width: 1024px) {
  .isd-site-header-container::after {
    background: none;
    pointer-events: none;
    z-index: 1;
  }
}
.isd-site-header-menu {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--isd-padding-xxl);
  width: auto;
  padding: 0 var(--isd-padding-xl);
}

@container body-container (max-width: 1024px) {
  .isd-site-header-menu {
    position: absolute;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    top: var(--isd-nav-height);
    background: var(--isd-nav-bg);
    border-bottom: 1px solid var(--isd-color-bg-900);
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    left: 0;
    width: 100%;
    padding: 0;
  }
  .isd-site-header-menu.active {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
    padding: var(--isd-padding-xl) 0;
  }
  .isd-site-header-menu::before {
    content: "";
    position: absolute;
    height: 5px;
    width: 100%;
    background-image: var(--isd-color-bg-linear-900);
    top: 0;
    left: 0;
  }
}
.isd-site-header-nav {
  height: var(--isd-nav-height);
}

.isd-site-nav-list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--isd-gap-m);
  height: 100%;
}

.isd-site-nav-list a {
  color: var(--isd-nav-font-color);
}

.isd-site-nav-list a:is(:hover, :focus) {
  color: color-mix(in oklab, var(--isd-nav-font-color) 60%, #ffffff 40%);
}

.isd-site-nav-list .menu-item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.isd-site-nav-list > .menu-item {
  height: 100%;
}

.isd-site-nav-list > :is(li.current-menu-item, li.current-menu-parent)::before {
  content: "";
  position: absolute;
  height: 3px;
  width: 100%;
  background-image: var(--isd-color-bg-linear-900);
  bottom: 7px;
}

.isd-site-nav-list > li.menu-item-has-children > a::after {
  content: "⯆";
  position: relative;
  font-size: 10px;
  margin-left: 3px;
  top: -3px;
  color: var(--isd-nav-font-color);
}

.isd-site-nav-list .sub-menu {
  position: absolute;
  top: var(--isd-nav-height);
  right: calc(0px - var(--isd-padding-xs));
  background-color: var(--isd-color-bg-500);
  -webkit-box-shadow: var(--isd-shadow-m);
          box-shadow: var(--isd-shadow-m);
  padding: var(--isd-padding-xxs) var(--isd-padding-l);
  display: none;
}

.isd-site-nav-list li.menu-item-has-children:is(:hover, :focus) .sub-menu {
  display: block;
}

.isd-site-nav-list .sub-menu::before {
  content: "";
  position: absolute;
  height: 5px;
  width: 100%;
  background-image: var(--isd-color-bg-linear-300);
  bottom: 0;
  left: 0;
}

.isd-site-nav-list .sub-menu .menu-item {
  height: auto;
  padding: var(--isd-padding-xs) 0;
  white-space: nowrap;
}

@container body-container (max-width: 1024px) {
  .isd-site-header-nav {
    height: auto;
    width: 100%;
  }
  .isd-site-nav-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .isd-site-nav-list > li.current-menu-item::before {
    display: none;
  }
  .isd-site-nav-list .menu-item {
    width: 100%;
  }
  .isd-site-nav-list .sub-menu {
    position: relative;
    right: auto;
    top: auto;
    display: block;
    -webkit-box-shadow: none;
            box-shadow: none;
    width: 100%;
    padding: 0;
    margin: var(--isd-margin-s);
    left: 0;
  }
  .isd-site-nav-list .sub-menu::before {
    display: none;
  }
}
.isd-site-footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: var(--padding-xxs);
  background: var(--isd-footer-bg);
}

.isd-site-footer p {
  font-size: var(--isd-fontsize-xs);
  color: var(--isd-footer-font-color);
}

.isd-site-aside {
  width: var(--isd-site-aside-width);
  border-right: 1px solid var(--isd-color-bg-300);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--isd-site-aside-width);
          flex: 0 0 var(--isd-site-aside-width);
  height: calc(100vh - var(--isd-nav-height));
  z-index: 1;
  left: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

@media (max-width: 1024px) {
  .isd-site-aside {
    left: calc(0px - var(--isd-site-aside-width));
  }
  .isd-site-aside.active {
    left: 0px;
  }
}
.isd-site-content {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
  background-color: var(--isd-color-bg);
  min-height: calc(100vh - var(--isd-nav-height));
}

.isd-site-main {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  background-color: var(--isd-color-bg);
  min-height: calc(100vh - var(--isd-nav-height));
}

.isd-site-wp-container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 90%;
  max-width: var(--isd-width-xl);
  padding: var(--isd-padding-xxl) 0;
  margin: 0 auto;
}

.isd-site-container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 90%;
  padding: var(--isd-padding-xxl) 0;
  max-width: var(--isd-width-xxl);
  margin: 0 auto;
}

.isd-site-main-single-work {
  background: #555;
}

.isd-single-work-split-wrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
  padding-bottom: var(--isd-padding-m);
  max-width: var(--isd-width-xxl);
  gap: var(--isd-gap-xl);
  margin: 0 auto;
}

.isd-single-work-left {
  position: relative;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--isd-width-s);
          flex: 0 0 var(--isd-width-s);
  -webkit-box-shadow: var(--isd-shadow-s);
          box-shadow: var(--isd-shadow-s);
  background: var(--isd-color-bg-600);
  padding: var(--isd-padding-l) var(--isd-padding-l) var(--isd-padding-m) var(--isd-padding-l);
}

@container body-container (min-width: 1024px) {
  .isd-single-work-left {
    position: sticky;
    top: var(--isd-nav-height);
    border-radius: 0 0 var(--isd-rounded-m) var(--isd-rounded-m);
  }
  body.admin-bar .isd-single-work-left {
    top: calc(var(--isd-nav-height) + 32px);
  }
}
.isd-single-work-left .isd-link-button {
  margin: var(--isd-margin-m) 0;
}

.isd-single-work-meta {
  margin: var(--isd-margin-xs) 0;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: var(--isd-gap-xs);
}

.isd-single-work-left .isd-wp-content {
  color: #444;
}

.isd-single-work-left .isd-wp-content :is(h1, h2, h3, h4, h5, h6) {
  color: var(--isd-color-1st-600);
}

.isd-single-work-left .wp-block-embed iframe {
  width: 100%;
  height: 310px;
}

.isd-single-work-right {
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  width: 100%;
  padding: var(--isd-padding-l);
  gap: var(--isd-gap-xl);
}

.single-work-gallery-item {
  position: relative;
  border-radius: var(--isd-padding-m);
  overflow: hidden;
  margin-bottom: var(--isd-margin-xl);
}

.single-work-gallery-item img {
  display: block;
  width: 100% !important;
  height: auto !important;
}

@container body-container (max-width: 1280px) {
  .isd-single-work-left {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 var(--isd-width-xs);
            flex: 0 0 var(--isd-width-xs);
  }
  .isd-single-work-left .wp-block-embed iframe {
    height: 200px;
  }
}
@container body-container (max-width: 1024px) {
  .isd-single-work-split-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .isd-single-work-left .wp-block-embed iframe {
    height: 55vw;
  }
}
@container body-container (max-width: 640px) {
  .isd-single-work-right {
    -webkit-column-count: 1;
       -moz-column-count: 1;
            column-count: 1;
  }
}
/* --- 應用於右側圖片 (由下往上依序淡入) --- */
/* --- 設定圖片延遲順序 --- */
.isd-single-work-right {
  opacity: 0;
  -webkit-animation: isdFadeInUp-100 1s cubic-bezier(0.215, 0.61, 0.355, 1) both;
          animation: isdFadeInUp-100 1s cubic-bezier(0.215, 0.61, 0.355, 1) both;
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(1) {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(2) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(3) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(4) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(5) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(6) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(7) {
  -webkit-animation-delay: 0.7s;
          animation-delay: 0.7s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(8) {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(9) {
  -webkit-animation-delay: 0.9s;
          animation-delay: 0.9s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(10) {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(11) {
  -webkit-animation-delay: 1.1s;
          animation-delay: 1.1s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(12) {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(13) {
  -webkit-animation-delay: 1.3s;
          animation-delay: 1.3s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(14) {
  -webkit-animation-delay: 1.4s;
          animation-delay: 1.4s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(15) {
  -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(16) {
  -webkit-animation-delay: 1.6s;
          animation-delay: 1.6s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(17) {
  -webkit-animation-delay: 1.7s;
          animation-delay: 1.7s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(18) {
  -webkit-animation-delay: 1.8s;
          animation-delay: 1.8s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(19) {
  -webkit-animation-delay: 1.9s;
          animation-delay: 1.9s;
}

.isd-single-work-right .single-work-gallery-item:nth-child(20) {
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
}

.isd-single-work-right .single-work-gallery-item {
  opacity: 0;
  -webkit-animation: isdFadeInUp-100 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) both;
          animation: isdFadeInUp-100 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) both;
}

.isd-single-work-related-container {
  background: var(--isd-color-bg-500);
  width: 100%;
}

.isd-site-main-index .isd-main-banner-wrapper {
  height: 100%;
}

.isd-site-index-banner-container {
  position: relative;
  width: 100%;
  height: 640px;
}

.isd-site-index-banner-overlay {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
}

@container body-container (max-width: 600px) {
  .isd-site-index-banner-container {
    height: 100vw;
  }
}
.isd-site-index-intro-container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  height: 500px;
  padding: var(--isd-padding-xxl) 0;
  background: url("/wp-content/uploads/2026/01/intro_bg.jpg") no-repeat center center;
  background-size: cover;
}

.isd-site-index-intro-container :is(h2, h3, h4) {
  padding: 0;
  font-weight: 100;
  line-height: 200%;
  text-align: center;
}

.isd-site-index-intro-container p {
  text-align: center;
  font-size: var(--isd-fontsize-xs);
}

.isd-nav-toggle {
  position: relative;
  width: 20px;
  height: 14px;
  cursor: pointer;
  z-index: 3;
}

.isd-nav-toggle span {
  position: absolute;
  display: block;
  width: 100%;
  height: 2px;
  top: calc(50% - 1px);
  background-color: var(--isd-color-1st-600);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.isd-nav-toggle span:nth-child(1) {
  top: calc(50% - 7px);
}

.isd-nav-toggle span:nth-child(3) {
  top: auto;
  bottom: calc(50% - 7px);
}

.isd-nav-toggle.active span:nth-child(1) {
  top: calc(50% - 1px);
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.isd-nav-toggle.active span:nth-child(2) {
  width: 0;
}

.isd-nav-toggle.active span:nth-child(3) {
  top: calc(50% - 1px);
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

@media (min-width: 1024px) {
  .isd-nav-toggle {
    display: none;
  }
}
.cta-button {
  background: var(--isd-color-bg-linear-700);
  color: var(--isd-color-bg);
  padding: var(--isd-padding-xxs) var(--isd-padding-xl);
  border: 0px;
  border-radius: calc(var(--isd-fontsize-xxs) * 0.5);
  -webkit-box-shadow: var(--isd-shadow);
          box-shadow: var(--isd-shadow);
  background-size: 200% auto;
  background-position: bottom right;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.cta-button:is(:hover, :focus) {
  background-position: top left;
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
}

.cta-button.active {
  background: var(--isd-color-bg-linear-100);
}

.isd-aside-toggle {
  position: absolute;
  right: -40px;
  bottom: 20px;
  background: #fff;
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid var(--isd-color-bg-900);
  cursor: pointer;
}

.isd-aside-toggle::before {
  content: "🠆";
}

.isd-aside-toggle.active::before {
  content: "🠄";
}

.isd-link-button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 8px 16px;
  background-color: var(--isd-color-1st-700);
  color: #fff !important; /* 強制白字 */
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  border-radius: var(--isd-rounded-xxs);
  -webkit-transition: color 0.3s ease, background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: color 0.3s ease, background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: transform 0.3s ease, color 0.3s ease, background-color 0.3s ease;
  transition: transform 0.3s ease, color 0.3s ease, background-color 0.3s ease, -webkit-transform 0.3s ease;
  white-space: nowrap; /* 文字不換行 */
  line-height: 1.2;
}

.isd-link-button::after {
  content: "🡵";
  display: inline-block;
  margin-left: 5px;
}

.isd-link-button:is(:hover, :focus) {
  background-color: var(--isd-color-1st-400);
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  color: #fff !important;
}

.meta-cat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.meta-cat dt {
  display: none;
}

.meta-cat dd {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.meta-cat span {
  padding: 0 10px;
  border-right: 1px solid #888;
}

.meta-cat span:first-child {
  padding-left: 0px;
}

.meta-cat span:last-child {
  padding-right: 0px;
  border-right: 0px;
}

.meta-cat span a {
  font-size: var(--isd-fontsize-xs);
  text-transform: uppercase;
  letter-spacing: calc(var(--isd-fontsize-s) * 0.05);
  display: inline-block;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
}

.meta-tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.meta-tag dt {
  display: none;
}

.meta-tag dd {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 3px;
}

.meta-tag span {
  display: inline-block;
  background: #f4f4f4;
  padding: 3px 8px;
  font-size: var(--isd-fontsize-xs);
  border-radius: 3px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.meta-tag span a {
  color: #666;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
}

.meta-tag span:is(:hover, :focus) {
  background: #222;
}
.meta-tag span:is(:hover, :focus) a {
  color: #fff;
}

.isd-separator-bar {
  width: 20%;
  height: 1px;
  background-color: #333;
  margin: var(--isd-margin-l) 0;
}

.isd-get-post-nav {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  gap: var(--isd-gap-s);
}

.isd-get-post-nav .nav-items {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--isd-gap-xxs);
}

.isd-get-post-nav .nav-item {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--isd-padding-xxs) var(--isd-padding-m);
  background-color: var(--isd-color-1st-700);
  color: #fff;
  font-size: var(--isd-fontsize-xs);
  border-radius: var(--isd-rounded-xs);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  white-space: nowrap; /* 文字不換行 */
}

.isd-get-post-nav .nav-item:is(:hover, :focus) {
  background-color: var(--isd-color-1st-400);
}

.isd-get-post-nav .nav-item a {
  color: #fff;
}

.isd-get-post-nav .nav-item a:is(:hover, :focus) {
  color: #fff;
}

@container body-container (max-width: 640px) {
  .isd-get-post-nav {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
/* =========================================

   Post Cards Container 卡片組件容器

   ========================================= */
/* --- 瀑布流容器 (Flex 佈局) --- */
.isd-post-card-grid-container {
  position: relative;
  display: block;
  width: 100%;
  padding: var(--isd-padding-xl) 0;
}

.isd-post-card-grid-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: var(--isd-gap-m);
}

/* 欄位設定 */
.isd-post-card-col {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 31%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-width: 0;
}

/* 響應式：平板改雙欄 */
@media (max-width: 921px) {
  .isd-post-card-grid-wrapper {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  .isd-post-card-col {
    width: 48%;
  }
  /* 隱藏第三欄，避免空欄佔位 (需配合 JS 邏輯，若 JS 動態分配會自動適應) */
  .isd-post-card-col:nth-child(3) {
    display: none;
  }
}
/* 響應式：手機改單欄 */
@media (max-width: 600px) {
  .isd-post-card-grid-wrapper {
    display: block;
  }
  .isd-post-card-col {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: none;
            flex: none;
    margin-bottom: 0;
  }
}
/* =========================================

   Post Card 卡片組件

   ========================================= */
.isd-post-card {
  margin-bottom: var(--isd-margin-m);
  background: #fff;
  border-radius: var(--isd-rounded-xs);
  -webkit-box-shadow: var(--isd-shadow-s);
          box-shadow: var(--isd-shadow-s);
  overflow: hidden;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  border: 1px solid #fff;
  /* 關鍵：預設隱藏，等待 JS 觸發動畫 */
  opacity: 0;
  -webkit-transform: translateY(100px);
          transform: translateY(100px);
  /* 效能優化 */
  will-change: transform, opacity;
}

/* 圖片樣式 */
.isd-post-card-image {
  position: relative;
  overflow: hidden;
  line-height: 0;
  z-index: 1;
  width: 100%;
  height: 20vw;
}

.isd-post-card-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: -webkit-transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

.isd-post-card:hover .isd-post-card-image img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

@media (min-width: 1350px) {
  .isd-post-card-image {
    height: 300px;
  }
}
@media (max-width: 921px) {
  .isd-post-card-image {
    height: 30vw;
  }
}
@media (max-width: 600px) {
  .isd-post-card-image {
    height: 50vw;
  }
}
/* 內容區域 */
.isd-post-card-content {
  padding: var(--isd-padding-m);
}

/* 摘要 */
.isd-post-card-excerpt {
  font-size: var(--isd-fontsize-xs);
  color: #555;
}

/* 當 JS 加入此 class 時執行動畫，強制覆蓋預設隱藏 */
.isd-post-card.isd-animated {
  -webkit-animation: isdFadeInUp-100 1s cubic-bezier(0.215, 0.61, 0.355, 1) both;
          animation: isdFadeInUp-100 1s cubic-bezier(0.215, 0.61, 0.355, 1) both;
}

/* --- Loading --- */
.isd-loading-spinner {
  text-align: center;
  padding: 20px;
  font-weight: bold;
  color: #888;
  width: 100%;
  clear: both;
}

#isd-post-card-load-trigger {
  height: 10px;
  width: 100%;
  margin-top: 20px; /* 增加一點間距確保不會過度頻繁觸發 */
}

.isd-site-main-title-container {
  position: relative;
  display: block;
  width: 100%;
}

.isd-site-main-title-container h2 {
  font-size: calc(var(--isd-fontsize-xxl) * 2);
  font-weight: 900;
  color: var(--isd-color-font);
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: var(--isd-margin-s) 0 0 0;
}

.isd-site-main-title-container h2 .t1 {
  position: relative;
  display: block;
}

.isd-site-main-title-container h2 .t2 {
  position: relative;
  display: block;
  font-size: var(--isd-fontsize-xxl);
  font-weight: 300;
  margin-left: var(--isd-margin-s);
}

.isd-site-main-title-container p {
  position: relative;
  display: block;
  color: var(--isd-color-font);
  padding-top: 0;
}

@container body-container (max-width: 1024px) {
  .isd-site-main-title-container {
    width: auto;
  }
  .isd-site-main-title-container h2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    text-align: center;
    font-size: calc(var(--isd-fontsize-xxl) * 1.5);
    margin-right: 0;
  }
}
.isd-category-list-container {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 100%;
  padding: var(--isd-padding-xl) 0 var(--isd-padding-l) 0;
}

.category-btns {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--isd-gap-xxs);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.category-btns .isd-link-button::after {
  content: "⇣";
}

.category-btns .isd-link-button.active {
  background: #222;
}

.category-btns .isd-link-button.active::after {
  content: "🠷";
}

/* =========================================

   全站 banner

   ========================================= */
.isd-main-banner-wrapper {
  position: relative;
  width: 100%;
  height: 400px;
  overflow: hidden;
  background: #000;
}

@media (max-width: 600px) {
  .isd-main-banner-wrapper {
    height: 70vw;
  }
}
.banner-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0; /* 預設隱藏 */
  visibility: hidden;
  -webkit-transition: opacity 1.2s ease-in-out, visibility 1.2s;
  transition: opacity 1.2s ease-in-out, visibility 1.2s; /* 1.2秒平滑淡入 */
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* 當有 is-active 時顯示 */
.banner-item.active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}

/* 文字層動畫 (可選：讓文字比圖片晚一點出現) */
.banner-item.active .banner-overlay {
  -webkit-animation: isdFadeIn 1s forwards;
          animation: isdFadeIn 1s forwards;
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
  opacity: 0;
}

/* 媒體層：填滿容器 */
.banner-media {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.banner-media img, .banner-media video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* 遮罩文字層 */
.banner-overlay {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  text-align: center;
  padding: 40px;
  pointer-events: none;
}

.banner-overlay h1 {
  padding: 0;
  font-size: calc(var(--isd-fontsize-xxl) * 3);
  white-space: nowrap;
  color: #fff;
  font-weight: 900;
  text-align: right;
  width: 100%;
}

@container body-container (max-width:1024px) {
  .banner-overlay h1 {
    text-align: center;
    font-size: calc(var(--isd-fontsize-xxl) * 2);
  }
}
@container body-container (max-width:640px) {
  .banner-overlay h1 {
    text-align: center;
    font-size: calc(var(--isd-fontsize-xxl) * 1.2);
  }
}
/* 全區塊點擊連結 */
.banner-full-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

.hidden {
  display: none;
}

.block {
  display: block;
}

@container body-container (min-width: 640px) {
  .sm\:hidden {
    display: none;
  }
  .sm\:block {
    display: block;
  }
}
@container body-container (min-width: 768px) {
  .md\:hidden {
    display: none;
  }
  .md\:block {
    display: block;
  }
}
@container body-container (min-width: 1024px) {
  .lg\:hidden {
    display: none;
  }
  .lg\:block {
    display: block;
  }
}
@container body-container (min-width: 1280px) {
  .xl\:hidden {
    display: none;
  }
  .xl\:block {
    display: block;
  }
}
/* --- 右側：由下往上淡入 --- */
@-webkit-keyframes isdFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes isdFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes isdFadeInUp-100 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes isdFadeInUp-100 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
/* --- 左側：由上往下滑入 --- */
@-webkit-keyframes isdFadeInDown-100 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes isdFadeInDown-100 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}/*# sourceMappingURL=style.css.map */