@charset "utf-8";
/* CSS Document */

/* 卡片 */
.card {
  overflow: hidden;
   cursor: pointer;
   transition: 0.3s;
   background:#FFF;
}

.card:hover {
  opacity: 0.9;
}
/* 圖片 */
.card img {
  width: 100%;
  transition: transform 0.6s ease;
}

/* 遮罩 */
.ex_overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 20px;
  color: #fff;

  background: linear-gradient(transparent, rgba(0,0,0,0.7));

  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

/* 文字 */
.card .de-line {
  position: relative;
  display: inline-block;/*上方導覽會跑掉*/
  transform: translateY(10px);
  opacity: 0;*/
  transition: all 0.4s ease;
}

/* 底線 */
.card .de-line::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 0;
  height: 2px;
  background: #fff;
  transform: translateX(-50%);
  transition: width 0.3s ease;
}

/* ===== hover 多段動畫 ===== */

/* 1️⃣ 圖片先動 */
.card:hover img {
  transform: scale(1.1);
}

/* 2️⃣ 遮罩淡入（延遲） */
.card:hover .ex_overlay {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

/* 3️⃣ 文字上移（再晚一點） */
.card:hover .de-line {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}

/* 4️⃣ 底線最後展開 */
.card:hover .de-line::after {
  width: 100%;
  transition-delay: 0.35s;
}


@media only screen and (max-width:768px){.story-content{font-size:1.125rem}}.about_history section.main-block{max-width:calc(1100px + var(--pageBlock-LR) * 2);margin:0 auto}.about_history section.main-block .main-content{padding:0 var(--pageBlock-LR) var(--pageBlock-Btm) var(--pageBlock-LR)}.title-box{max-width:550px;margin:0 auto;padding:50px 0}@media only screen and (max-width:1024px){.title-box{padding:30px 0}}.title-box .main{text-align:center;font-size:2.5rem;font-weight:600;line-height:1.3;letter-spacing:0.5px}@media only screen and (max-width:768px){.title-box .main{font-size:1.75rem}}..sort-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;z-index:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-top:20px}

@media only screen and (max-width:768px){.title-box .main{font-size:1.75rem}}.sort-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;z-index:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-top:30px}@media only screen and (max-width:1024px){.sort-wrap{margin-top:15px}}.sort-wrap .select-display{color:#808080}.sort-wrap .dropdown-icon{border-color:#808080 transparent transparent transparent}.sort-wrap dropdown-el{width:250px;position:relative;display:block}.sort-wrap .select-wrapper{background-color:#fff;border-radius:5px;border:solid 1px rgba(128,128,128,0.3);padding-inline:25px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:48px;padding:15px}.history-data-box{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;margin-top:-50px}.history-data-box .year-group{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:50px}