
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:"Microsoft JhengHei","PingFang TC",sans-serif;
  background:linear-gradient(135deg,#b2fef7,#e0f7fa);
  color:#2c3e50;
  line-height:1.8;
}
.container{
  max-width:1200px;
  margin:20px auto;
  background:#fff;
  border-radius:15px;
  box-shadow:0 10px 25px rgba(0,0,0,0.1);
  padding:20px;
}
header{
  background:linear-gradient(135deg,#26c6da,#00acc1);
  color:white;
  text-align:center;
  border-radius:15px 15px 0 0;
  padding:50px 10px;
  margin:-20px -20px 40px -20px;
}
header h1{
  font-size:2.5em;
  margin-bottom:10px;
}
header p{font-size:1.2em;opacity:0.9;}

figure{
  margin:20px 0;
  text-align:center;
}
figure img{
  width:100%;
  border-radius:12px;
  box-shadow:0 4px 15px rgba(0,0,0,0.2);
}
figcaption{
  font-size:0.95em;
  color:#555;
  margin-top:8px;
}
h2{
  font-size:2em;
  border-bottom:3px solid #00acc1;
  padding-bottom:6px;
  color:#007b8f;
  margin-top:30px;
  margin-bottom:15px;
}
p{margin-bottom:15px;text-align:justify;font-size:1.1em;}
ul{margin-left:20px;}
.highlight{
  background:#e0f7fa;
  padding:15px 20px;
  border-left:5px solid #00acc1;
  border-radius:10px;
  margin:20px 0;
}
.table-box{
  overflow-x:auto;
  border-radius:10px;
  box-shadow:0 5px 15px rgba(0,0,0,0.1);
  margin-bottom:30px;
}
table{
  width:100%;
  border-collapse:collapse;
}
th{
  background:#00acc1;
  color:white;
  padding:12px;
  text-align:left;
}
td{
  padding:12px;
  border-bottom:1px solid #eee;
}
tr:nth-child(even){background:#f9f9f9;}
.faq{
  background:#f5fafa;
  padding:20px;
  border-radius:10px;
  margin-top:40px;
}
.q{
  background:linear-gradient(135deg,#26c6da,#00acc1);
  color:white;
  padding:15px;
  border-radius:8px;
  cursor:pointer;
  position:relative;
  margin-bottom:10px;
  transition:all .3s;
  font-weight:bold;
}
.q::after{
  content:"+";
  position:absolute;
  right:20px;
  font-size:1.6em;
  top:50%;
  transform:translateY(-50%);
  transition:transform .3s;
}
.q.active::after{transform:translateY(-50%) rotate(45deg);}
.a{
  display:none;
  background:white;
  border-left:4px solid #00acc1;
  padding:15px;
  border-radius:8px;
}
.a.show{display:block;animation:fade .3s;}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
.contact{
  background:linear-gradient(135deg,#26c6da,#0097a7);
  color:white;
  text-align:center;
  padding:30px;
  border-radius:10px;
  margin-top:40px;
}
.contact a{
  display:inline-block;
  margin:8px;
  padding:10px 22px;
  background:white;
  color:#0097a7;
  border-radius:25px;
  font-weight:bold;
  text-decoration:none;
  transition:all .3s;
}
.contact a:hover{transform:translateY(-2px);box-shadow:0 5px 10px rgba(0,0,0,.2);}
@media(max-width:768px){
  header h1{font-size:1.8em;}
  table{font-size:0.9em;}
  .container{margin:10px;padding:15px;}
}
