body{background-repeat: repeat;background-position: 0;background-size: auto;background-attachment: inherit;background: url(/images/22/bg.jpg) repeat;}
#sub-banner a{display:block;background-repeat:no-repeat;background-position:50% 50%;background-size: cover;}
#sub-banner{margin-top: 70px;}
#sub-banner img{width:100%;aspect-ratio: 1920/400;}
.inside{width: 80%;overflow:hidden;margin: 80px auto;}
.main-article{float: unset;width: 100%;}
.bigwidth .main-article{width:100%}
#side-nav{float:right;width:290px;margin: 20px;display: none;}
.waylink{margin-top: 0;}
.waylink .inside{margin:0 auto;padding: 20px 0;}
.waylink .side-title:after{content:'';width:calc(100% - 22px);height:calc(100% - 22px);border:1px solid #7b6341;position:absolute;left:10px;top:10px}
.waylink .side-title h2 b{display:block;color:#a99b80;margin-top:10px;font-weight: normal;font-size: 30px;line-height: 1.2;letter-spacing: 2px;margin-bottom: 20px;position: relative;font-family: 'cwTeXKai', serif;}
.waylink .side-title svg{position:absolute;top:5px;right:5px;width:23px;height:23px;z-index:5}
.waylink .side-title{visibility:hidden;}
polyline{stroke-width:1;stroke:#785141;stroke-dasharray:150;stroke-dashoffset:150;-moz-animation:ani_svgShowLine 1s .2s linear forwards;-webkit-animation:ani_svgShowLine 1s .2s linear forwards;animation:ani_svgShowLine 1s .2s linear forwards}
@keyframes
ani_svgShowLine {
to{stroke-dashoffset:0}
}
.waylink ol{margin: 0 0;padding:0;text-align:right;display:inline-block;vertical-align:bottom;}
.waylink ol li{display:inline-block;vertical-align:top;position:relative;padding-left:25px;color:#241f2f;font-weight:400;font-size: 23px;}
.waylink ol li:after{content:'/';position:absolute;color:#737373;top:0;left:8px}
.waylink ol li:first-child{padding-left:0}
.waylink ol li:first-child:after{display:none}
.waylink ol li a{color:#241f2f;font-weight:400;font-size: 23px;}
.waylink ol li:last-child a{color:#241f2f;}
.main-article .pagetitle{margin-bottom:50px;font-weight:400;font-size: 20px;color: #333;width: calc(100% - 0px);display: inline-block;vertical-align: top;line-height: 28px;border-bottom: 1px solid #ccc;padding: 0 0 40px;margin: 0 0 35px;}
.main-article #describe{color: #545454;font-size:15px;}
#side-nav #contact-nav,#contact-extra{margin-top:50px}
#side-nav #contact-nav h3,#category-nav >h3,#contact-extra >h3{font-size:16px;line-height:110%;color:#c5c5c5;margin-bottom:20px}
#side-nav #contact-nav h3 strong,#contact-extra h3 strong{font-size:20px;font-weight:400;line-height:110%;color: #241f2f;}
#side-nav .Cate >li h3,#side-nav .Cate >li .subUL li .subULHead,#contact-nav ul li,#contact-extra ul li{overflow:hidden;position:relative;}
#contact-extra ul li {padding:15px 0;color:#fff;}

#side-nav .topic{
    font-size: 24px;
    position: relative;
    display: block;
    text-decoration: none;
    color: #333;
    padding: 0 0 22px;
}
#side-nav .topic i{
    padding: 0 10px 0 0;
}#side-nav .Cate{
        border-bottom: 1px solid #d2d2d2;
}

#side-nav .Cate >li h3,#side-nav .Cate >li .subUL li .subULHead p{width:calc(100% - 25px)}
#side-nav .Cate >li >h3{width:100%}
#side-nav .Cate >li h3 span{color: #cacaca;margin-right:8px;vertical-align:bottom;font-weight:700;font-size:20px;}
#side-nav .Cate >li h3 b,#side-nav .Cate >li .subUL li .subULHead b{color:#6d6d6d;font-weight:700;font-size:20px;position:absolute;right:0;top:0;cursor:pointer;display:block;width:50px;height:53px;text-align:center;line-height:53px;display: none;}
#side-nav .Cate >li h3 a,#side-nav .Cate >li .subUL li .subULHead p a,#side-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a,#contact-nav ul li a,#contact-extra ul li a{padding: 13px 0;}
#side-nav .Cate li a,#contact-nav ul li a,#contact-extra ul li a{font-size:15px;display:block;color:#241f2f;transition:all linear .2s}
#contact-extra ul li a{padding: 0; display: inline-block;}
#side-nav .Cate li a:hover,#side-nav .Cate li.action a,#contact-nav ul li a:hover,#contact-extra ul li a:hover{color: #3c3c3c;}
#side-nav .Cate li ul{overflow:hidden;display:none}
#side-nav .Cate li.action >ul{display:block}
#side-nav .Cate li.action >ul li{display: block;}
#side-nav .Cate >li .subUL li .subULHead p a{padding-left:20px;color:#241f2f;}

#side-nav .Cate >li .subUL li .subULHead p a:hover,#side-nav .Cate >li .subUL li.action .subULHead p a{color: #b69e73;}
#side-nav .Cate >li .subUL li .subULHead b{color:#d3d3d3}
#side-nav .Cate >li .subUL li .sub2UL li .sub2ULHead p a{padding-left:35px;border-bottom:1px solid #444;color:gray}
#side-nav .Cate >li .subUL li .sub2UL li.action .sub2ULHead p a{background:#ededed}
#ssbanner-list .bxslider div a{background-repeat:no-repeat;background-position:50% 50%;background-size:contain;background-color:#f6fcfd;display:block;transition:all ease-in-out .3s;width:100%;height:100%}
#side-nav #contact-nav ul li a{text-align:left}
#side-nav #contact-nav ul li a i{margin-right:5px}
#community{margin:50px 0}
#community li{float:left;margin:0 5px 5px 0;line-height:0}
.index-title h4{color: #525252;}
.index-title p{color:#fff;float: left;background: #faf6f3;}
.index-title h2{color: #FFFFFF;float: left;padding: 0 15px;text-transform: uppercase;font-family: Arial, Helvetica, 'Noto Sans TC', "微軟正黑體", Heiti TC, "メイリオ", sans-serif;font-size: 30px;background: #000000;}
.index-title h3 a{color: #FFFFFF;font-size: 20px;background: #000000;padding: 0 15px 0 5px;padding: 0 0 0 15px;}
.index-title h3:before {
    content: '/';
    color: #737373;
    top: 0px;
    left: 5px;
}
:after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#exhibition-list .upcoming-box .h2:after {
    content: '';
    position: absolute;
    width: calc(100% - 250px);
    height: 13px;
    background: url(/images/22/separate_line.png) left center repeat;
    right: 0;
    bottom: 4px;
}


@media screen and (max-width: 1440px) {
.waylink .side-title{width:130px;height:120px}
.waylink .side-title h2{font-size:14px}
.waylink .side-title h2 b{font-size:20px;margin-top:10px}
.waylink ol{margin:10px auto 35px}
}
@media screen and (max-width: 1366px) {
.inside{width:90%}
}
@media screen and (min-width: 1025px) {
#sub-banner a{}
}
@media screen and (max-width: 1024px) {
.main-article{width:100%}
#side-nav{width: 88%;/* margin-top:80px; */}
#fb-wrap,#g-map,#youtube{width:300px;margin:5px auto;text-align:center}
#sub-banner{margin-top:88px}
.waylink .side-title{display:table;margin:0 auto;padding:30px 40px;width:180px;height:80px}
.waylink ol{display:block;text-align:center}
.waylink ol li a{padding:0}
#ssbanner .bigname h2{color:#b5b5b5}
#ssbanner .bigname p{color:#ecd9c1}
}
@media screen and (max-width: 640px) {
.waylink .inside{margin: 0px auto;padding: 0;}
.main-article .pagetitle{/* font-size:30px */}
.waylink ol li,.waylink ol li a,.waylink ol li .h3,.waylink ol li:after{font-size:8pt}
#sub-banner{margin-top:69px}
.waylink .side-title{padding:20px 30px}
.waylink .side-title:after{left:5px;top:5px;width:calc(100% - 12px);height:calc(100% - 12px)}
.waylink .side-title svg{width:18px;height:18px}
.waylink .side-title h2{font-size:12px;line-height:120%}
.waylink .side-title h2 b{font-size:18px;margin-top:5px}
.waylink{margin-top: 0;}
  #sub-banner img{aspect-ratio: 13/7;}
  .waylink ol{margin: 10px auto 0px;}
  .inside{margin: 40px auto 80px;}
}
@media screen and (max-width: 480px) {
.main-article .pagetitle{/* margin-bottom:20px */}
#sub-banner img{padding:30px 0}
}


/* ===== 學習地點 ===== */
:root{
  --bg:#f7f5f2;
  --card:#ffffff;
  --ink:#2b2b2b;
  --muted:#6b7280;
  --brand:#ba8b00;       /* 黃金色 */
  --accent:#e11d48;      /* 紅色強調 */
  --radius:16px;
  --shadow:0 10px 30px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
.main-article{
  color:var(--ink);
  line-height:1.75;
}
.main-article .pagetitle{
  font-size:clamp(24px,2.8vw,36px);
  margin:0 0 16px;
  letter-spacing:.5px;
}
.desc-box{
  background:var(--bg);
  border-radius:calc(var(--radius) + 4px);
  padding: clamp(16px,2.5vw,28px);
  box-shadow:var(--shadow);
  border:1px solid rgba(0,0,0,.04);
  margin-bottom: clamp(20px,3vw,32px);
}
.desc-box .lead{
  font-size:clamp(16px,2vw,18px);
  margin:0 0 8px;
  font-weight:700;
}
.desc-box .tip{
  margin:6px 0 0;
  color:var(--muted);
}
.desc-box a{ color:var(--brand); text-decoration:underline; }
.desc-box a:hover{ opacity:.9; }

/* ===== 地點區塊 ===== */
.locations{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(16px,2.5vw,24px);
}
@media (min-width:700px){
  .locations{ grid-template-columns: repeat(2, 1fr); }
}
@media (min-width:1100px){
  .locations{ grid-template-columns: repeat(3, 1fr); }
}
.loc-card{
  background:var(--card);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  border:1px solid rgba(0,0,0,.06);
  display:flex;
  flex-direction:column;
}
.loc-body{
  padding: clamp(16px,2.2vw,22px);
}
.loc-title{
  font-size:clamp(18px,2.2vw,22px);
  margin:0 0 8px;
}
.loc-meta p{
  margin:6px 0;
}
.loc-meta strong{ color:var(--accent); }
.loc-meta a{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px dashed rgba(0,0,0,.2);
}
.loc-meta a:hover{ opacity:.85; }

/* ===== Map Iframe：等比 RWD ===== */
.map-wrap{
  aspect-ratio: 16 / 10;
  width:100%;
  background:#eee;
}
.map-wrap iframe{
  width:100%;
  height:100%;
  border:0;
}

/* ===== 分隔線（可選） ===== */
.hr{
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(0,0,0,.12), transparent);
  margin: clamp(20px,3vw,32px) 0;
}

/* ===== 社群分享 ===== */
#community{
  margin-top: clamp(16px,2.8vw,24px);
}
#community ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:center;
}
#community li{
  display:flex;
  align-items:center;
}

#community iframe{
  max-width:100%;
}

/* 歷年展覽 */

#describe01{
  --ink:#1f2937;       
  --muted:#667085;    
  --bg:#f7fafc;       
  --card:#ffffff;     
  --border:rgba(15,23,42,.08);
  --brand:#12b3a6;      
  --brand2:#0ea5e9;    
  --radius:16px;
  --shadow:0 12px 28px rgba(15,23,42,.08);
  color: var(--ink);
}

/* 區塊標題（左右細線＋置中標題） */
#describe01 .section-head{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin: 0 0 14px;
}
#describe01 .section-head .line{
  flex:1 1 120px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(15,23,42,.15), transparent);
}
#describe01 .section-head .title{
  font-weight:900; 
  font-size:clamp(18px,2.2vw,24px);
  letter-spacing:.3px;
  color:#0f172a;
}

/* 卡片容器 */
#describe01 .doclist{
  background: var(--card);
  border-radius: var(--radius);
  border:1px solid var(--border);
  box-shadow: var(--shadow);
  overflow:hidden;
  margin-top: 6px;
}
#describe01 .doclist .topbar{
  height:6px;
  background: linear-gradient(90deg, var(--brand), var(--brand2));
}


#describe01 .doc-row{
  display: grid;
  grid-template-columns: 1fr;   
  align-items: center;
  gap: 8px;
  padding: 16px clamp(14px,2.4vw,24px);
  border-bottom:1px solid var(--border);
  transition: background-color .15s ease;
}
#describe01 .doc-row:last-child{ border-bottom:none; }


#describe01 .doc-row:hover{
  background: #f7fbff;
}


#describe01 .doc-name{ min-width:0; }
#describe01 .doc-name a{
  color: var(--ink);
  text-decoration: none;
  font-weight: 700;
  display: inline;             
  position: relative;
  line-height: 1.6;
}
#describe01 .doc-name a:hover{ text-decoration: underline; }


#describe01 .doc-name a[target="_blank"]::after{
  content:"↗";
  margin-left: 6px;
  font-size: .9em;
  opacity: .45;
}


#describe01 .doc-row.is-text .doc-name{ font-weight:700; }


#describe01 .doc-action{ display:none !important; }


@media (max-width: 640px){
  #describe01 .doc-row{ padding: 14px 14px; }
  #describe01 .section-head{ gap:8px; }
}


#describe01 .doc-name a:focus-visible{
  outline: none;
  box-shadow: 0 0 0 4px rgba(14,165,233,.20);
  border-radius: 6px;
}


@media print{
  #describe01 .doclist{ box-shadow:none; border-color:#ddd; }
  #describe01 .doclist .topbar{ display:none; }
  #describe01 .doc-row{ background:#fff !important; }
}

/* ===== 媒體報導 ===== */
:root{
  --ink:#1f2937;           
  --muted:#667085;          
  --card:#ffffff;         
  --border:rgba(15,23,42,.10);
  --brand:#12b3a6;       
  --brand2:#0ea5e9;        
  --radius:16px;
  --shadow:0 12px 28px rgba(15,23,42,.08);
}


.videotitlle h2{
  margin: 6px 0 10px;
  color:#0b1730;
  letter-spacing:.4px;
  position: relative;
}
.videotitlle h2::after{
  content:"";
  display:block;
  height:6px;
  width:min(240px, 42%);
  margin: 10px auto 0;
  border-radius:999px;
  background: linear-gradient(90deg, var(--brand), var(--brand2));
  box-shadow: 0 6px 14px rgba(14,165,233,.18);
}


.videonews{
  display:grid;
  grid-template-columns: 1fr;    
  gap: clamp(12px, 2vw, 18px);
    max-width: 900px;    
  margin: 0 auto 24px;
}
@media (min-width: 640px){                
  .videonews{ grid-template-columns: repeat(2, 1fr); }
}


.videonews iframe{
 width:100% !important;
  height:auto !important;
  aspect-ratio: 16 / 9;
  display:block;
  background:#000;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 12px 28px rgba(15,23,42,.08);
}


.videoaa{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 6px 0 clamp(18px, 3vw, 28px);
}
@media (min-width: 900px){
  .doc-row{ grid-template-columns: repeat(2, 1fr); } 
}
.news-name a{
  display:block;
  background: var(--card);
  border:1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  color: var(--ink);
  text-decoration:none;
  font-weight:700;
  line-height:1.6;
  box-shadow: var(--shadow);
  position:relative;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
.news-name a:hover{
  transform: translateY(-1px);
  background:#f7fbff;
  border-color: rgba(14,165,233,.28);
  box-shadow: 0 16px 28px rgba(15,23,42,.10);
}
.news-name a::after{
  content:"↗";
  position:absolute; right:12px; top:50%;
  transform: translateY(-50%);
  font-size: 14px; color: var(--muted);
}


@media (max-width: 480px){
  .news-name a{ padding: 12px 14px; }
}


@media print{
  .videotitlle h2::after{ display:none; }
  .videonews iframe, .news-name a{
    box-shadow:none; border-color:#ddd;
  }
}


/* 表單下載 */

.formdownload{
  --ink:#1f2937;
  --muted:#667085;
  --card:#ffffff;
  --border:rgba(15,23,42,.10);
  --brand:#12b3a6;
  --brand2:#0ea5e9;
  --radius:14px;
  --shadow:0 12px 28px rgba(15,23,42,.08);
  color: var(--ink);
}


.formdownload .formgrid{
  list-style:none;
  margin: 8px auto 0;
  padding: 0 12px;
  display:grid;
  gap: clamp(10px, 2vw, 16px);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  max-width: 900px;
}


.formdownload .formitem{ min-width:0; }
.formdownload .doc-link,
.formdownload .formitem.is-text{
  display:flex; align-items:center; gap:10px;
  background: var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  text-decoration:none;
  color: var(--ink);
  box-shadow: var(--shadow);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}

.formdownload .doc-name{
  font-weight:800; line-height:1.6; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}


.formdownload .doc-link .file-badge{
  margin-left:auto;
  font-size:12px; font-weight:800; letter-spacing:.5px;
  padding: 4px 8px; border-radius:999px;
  color:#0b1730; background:#eef7ff;
  border:1px solid rgba(14,165,233,.25);
}
.formdownload .doc-link .ext{
  margin-left:6px; color: var(--muted);
}


.formdownload .doc-link:hover{
  transform: translateY(-1px);
  background:#f7fbff;
  border-color: rgba(14,165,233,.28);
  box-shadow: 0 16px 28px rgba(15,23,42,.10);
}
.formdownload .doc-link:focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(14,165,233,.22), var(--shadow);
  border-color: rgba(14,165,233,.45);
  border-radius: var(--radius);
}


@media (max-width: 480px){
  .formdownload .formgrid{ padding: 0 10px; }
  .formdownload .doc-link, .formdownload .formitem.is-text{ padding: 12px; }
  .formdownload .doc-name{ white-space:normal; }
}


@media print{
  .formdownload .doc-link, .formdownload .formitem.is-text{
    box-shadow:none; border-color:#ddd;
  }
}

/* ===== 色票（可依品牌調整） ===== */
.fraud-alert{
  --ink:#0b1730;
  --muted:#667085;
  --card:#ffffff;
  --bg:#f7fafc;
  --border:rgba(15,23,42,.10);
  --brand:#12b3a6;     /* 主色：青綠 */
  --brand2:#0ea5e9;    /* 輔色：天藍 */
  --radius:16px;
  --shadow:0 12px 28px rgba(15,23,42,.08);
  color:var(--ink);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding: clamp(14px, 2.6vw, 20px);
  max-width: 980px;
  margin: 0 auto clamp(18px, 3vw, 28px);
  position: relative;
}

/* 頂部彩條 */
.fraud-alert::before{
  content:"";
  position:absolute; left:16px; right:16px; top:-3px; height:6px;
  background:linear-gradient(90deg, var(--brand), var(--brand2));
  border-radius:999px;
}

/* 主視覺 */
.fraud-hero{
  margin:0 0 10px;
  border-radius: 12px;
  overflow:hidden;
  border:1px solid var(--border);
}
.fraud-hero img{
  width:100%; height:auto; display:block;
}

/* 標題與段落 */
.fraud-alert h2{
  margin:8px 0 8px;
  font-size: clamp(20px, 2.6vw, 28px);
  line-height:1.3;
  letter-spacing:.5px;
  font-weight: 900;
}
.fraud-alert .lead{
  font-size: clamp(15px, 1.8vw, 17px);
  color:#0f172a;
}

/* 小標題 */
.fraud-alert .sub{
  margin: 12px 0 6px;
  font-size: clamp(16px, 2vw, 18px);
  font-weight: 800;
}

/* 重點條列 */
.alert-list{
  margin: 0 0 10px 0; padding: 0;
  list-style: none;
  display: grid; gap: 8px;
}
.alert-list li{
  display:flex; gap:10px; align-items:flex-start;
  padding: 10px 12px;
  background: linear-gradient(180deg, #fff, #f8fcff);
  border:1px solid var(--border);
  border-radius:12px;
  position:relative;
}
.alert-list li::before{
  content:"⚠️";
  flex:0 0 auto; line-height:1.1; font-size: 18px;
}

/* 聯絡卡片：RWD 網格（手機1欄，>=640px 2欄，>=980px 3欄） */
.contact-grid{
  display:grid; gap: 10px;
  grid-template-columns: 1fr;
  margin-top: 6px;
}
@media (min-width: 640px){
  .contact-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 980px){
  .contact-grid{ grid-template-columns: repeat(3, 1fr); }
}
.contact-card{
  display:flex; align-items:center; gap:10px;
  background: var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px 14px;
  color:var(--ink); text-decoration:none;
  box-shadow: var(--shadow);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
.contact-card:hover{
  transform: translateY(-1px);
  background:#f7fbff;
  border-color: rgba(14,165,233,.28);
  box-shadow: 0 16px 28px rgba(15,23,42,.10);
}
.contact-card:focus-visible{
  outline:none;
  box-shadow: 0 0 0 4px rgba(14,165,233,.22), var(--shadow);
  border-color: rgba(14,165,233,.45);
}
.cntact-card .icon{ font-size:18px; }
.contact-card .meta .name{ font-weight:800; line-height:1.4; }
.contact-card .meta .phone{ color: var(--muted); }


.fraud-alert p{ margin: 8px 0; line-height:1.8; }

@media (max-width: 420px){
  .fraud-alert{ padding: 12px; }
  .alert-list li{ padding: 10px; }
}

/* ===== 公告卡片（RWD / 亮色） ===== */
.notice-card{
  --ink:#0b1730; --muted:#667085; --card:#ffffff; --bg:#f7fafc;
  --border:rgba(15,23,42,.10);
  --brand:#12b3a6; --brand2:#0ea5e9; /* 可換成品牌色 */
  --radius:16px; --shadow:0 12px 28px rgba(15,23,42,.08);

  color:var(--ink);
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:clamp(14px,2.6vw,20px);
  max-width:980px; margin:0 auto clamp(18px,3vw,28px);
  position:relative;
}


.notice-card::before{
  content:""; position:absolute; left:16px; right:16px; top:-3px; height:6px;
  background:linear-gradient(90deg,var(--brand),var(--brand2));
  border-radius:999px;
}


.notice-hero{ margin:0 0 10px; border-radius:12px; overflow:hidden; border:1px solid var(--border); }
.notice-hero img{ width:100%; height:auto; display:block; }


.notice-card h2{
  margin:6px 0 6px;
  font-size:clamp(20px,2.6vw,28px);
  letter-spacing:.4px; font-weight:900;
}
.notice-card p{ margin:8px 0; line-height:1.8; }


.deadlines{
  display:flex; flex-wrap:wrap; gap:8px;
  margin: 6px 0 8px;
}
.deadlines .pill{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 12px;
  background:#f0fbff;
  color:#0b1730;
  border:1px solid rgba(14,165,233,.25);
  border-radius:999px;
  font-weight:800; letter-spacing:.3px;
}
.deadlines .pill strong{ font-weight:900; }


.cta{ margin-top:6px; }
.btn{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:4px; text-decoration:none;
  padding:12px 16px; border-radius:12px;
  color:#0b1730; background:linear-gradient(180deg,#ffffff,#f7fbff);
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 8px 18px rgba(15,23,42,.08);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
.btn:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.35);
  box-shadow: 0 16px 28px rgba(14,165,233,.15);
  background:linear-gradient(180deg,#ffffff,#f3f9ff);
}
.btn .btn-text{ font-weight:900; font-size:clamp(16px,2vw,18px); }
.btn .btn-sub{
  font-size:12px; color:var(--muted); max-width:100%;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}


.notice-box{
  margin-top:10px;
  background: linear-gradient(180deg,#fff,#f8fcff);
  border:1px solid var(--border);
  border-left:4px solid var(--brand2);
  border-radius:10px;
  padding:12px 14px;
  line-height:1.8;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}


@media (max-width:420px){
  .notice-card{ padding:12px; }
  .btn{ padding:12px; }
}


/*  費用/優惠/退費 區塊  */
:root{
  --ink:#0b1730;              
  --muted:#667085;            
  --card:#ffffff;                
  --bg:#f7fafc;                 
  --border:rgba(15,23,42,.12);  
  --brand:#12b3a6;               
  --brand2:#0ea5e9;             
  --radius:16px;               
  --shadow:0 12px 28px rgba(15,23,42,.08);
}


.fee-section,
.discount-section,
.refund-section{
  color: var(--ink);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(14px, 2.6vw, 20px);
  max-width: 1100px;
  margin: 12px auto;
  position: relative;
}


.fee-section::before,
.discount-section::before,
.refund-section::before{
  content:"";
  position:absolute; left:16px; right:16px; top:-3px; height:6px;
  background: linear-gradient(90deg, var(--brand), var(--brand2));
  border-radius: 999px;
}


.fee-title,
.discount-title,
.refund-title{
  font-weight: 900;
  font-size: clamp(20px, 2.4vw, 26px);
  letter-spacing: .3px;
  margin: 4px 0 12px;
  color:#0b1730;
}


.fee-card,
.refund-card{
  background: linear-gradient(180deg, #fff, #f8fcff);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 14px;
}


.fee-card p, .refund-card p,
.fee-card li, .refund-card li,
.discount-card p, .discount-card li{
  line-height: 1.8;
  color: var(--ink);
}
.fee-card strong,
.refund-card strong,
.discount-card strong{ color:#0b1730; }


.fee-card strong + span,
.fee-card strong:has(+ span),
.refund-card strong + span{
  margin-left: .25em;
}


.fee-card ol, .fee-card ul,
.refund-card ol, .refund-card ul,
.discount-card ol, .discount-card ul{
  margin: 6px 0 8px;
  padding-left: 1.2em;
}
.fee-card li + li,
.refund-card li + li,
.discount-card li + li{ margin-top: 6px; }


.discount-container{
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(10px, 2vw, 16px);
  margin-top: 8px;
}
@media (min-width: 640px){ .discount-container{ grid-template-columns: repeat(1, 1fr); } }
@media (min-width: 1024px){ .discount-container{ grid-template-columns: repeat(2, 1fr); } }


.discount-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: var(--shadow);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
.discount-card:hover{
  transform: translateY(-1px);
  background:#f7fbff;
  border-color: rgba(14,165,233,.28);
  box-shadow: 0 16px 28px rgba(15,23,42,.10);
}
.discount-card h3{
  margin: 0 0 6px;
  font-size: clamp(16px, 2.1vw, 18px);
  font-weight: 800;
  line-height: 1.5;
  color:#0b1730;
}


.refund-table{
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.refund-table th,
.refund-table td{
  padding: 10px 12px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  text-align: center;
  white-space: normal;
}
.refund-table th{
  background: #f3f8ff;
  color:#0b1730;
  font-weight: 800;
}
.refund-table tr:nth-child(even) td{ background: #fbfdff; }
.refund-table tr:last-child td{ border-bottom: none; }


.contentbuilder .col-md-12{
  overflow-x: auto;
}
.contentbuilder .col-md-12::-webkit-scrollbar{ height: 10px; }
.contentbuilder .col-md-12::-webkit-scrollbar-thumb{
  background: rgba(15,23,42,.2); border-radius: 999px;
}

@media (max-width: 480px){
  .refund-table th, .refund-table td{ padding: 8px 10px; font-size: 13px; }
}


.fee-card a, .refund-card a, .discount-card a{
  color: #0a7ec2; text-decoration: none; border-bottom: 1px dashed rgba(10,126,194,.35);
}
.fee-card a:hover, .refund-card a:hover, .discount-card a:hover{
  color:#075985; border-bottom-color: rgba(7,89,133,.55);
}

@media (max-width: 420px){
  .fee-section, .discount-section, .refund-section{ padding: 12px; }
}


@media print{
  .fee-section, .discount-section, .refund-section{
    box-shadow: none; border-color: #ddd; background: #fff;
  }
}