.table-wrapper {
/* margin: 50px; */
box-shadow: 0px 35px 50px rgba(27, 31, 49, 0.1);
margin: 10px 0;
}

.fc-header {
border-collapse: collapse;
width: 100%;
/* background-color: #fafafa; */
table-layout: fixed;
}

.fc-header td,
.fc-header th {
text-align: center;
padding: 10px;
}

.fc-header td {
border-right: 1px solid #f8f8f8;
}

/*  thead th color
------------------------------- */

.fc-header thead th {
color: #ffffff;
background: #ffb4a2; /* 指定第一個和預設的標題顏色 */
}

.fc-header thead th:nth-child(2) {
background: #e5989b; /* 指定第二個標題顏色 */
}

.fc-header thead th:nth-child(3) {
background: #b5838d; /* 指定第三個標題顏色 */
}

.fc-header thead th:nth-child(4) {
background: #6d6875; /* 指定第四個標題顏色 */
}

/*  table ul
------------------------------- */

.fc-header ul {
padding: 20px;
margin: 0;
text-align: left;
}
.fc-header ul li {
border-bottom: 1px solid #e7e7e7;
padding: 5px;
position: relative;
list-style-type: none;
}

@media (max-width: 767px) {
.table-wrapper {
/* margin: 30px 15px; */
margin:5px;
}

.fc-header thead {
display: none;
}

.fc-header td {
display: block; /* 一定要下！ */
padding: 0;
width: 100%;
white-space: unset;
}

.fc-header td:before {
content: attr(data-title); /* 顯示 data-title */
display: inline-block;
/* width: 100%; */
font-weight: 500;
/* padding: 6px 0; */
color: #ffffff;
background: #ffb4a2; /* 指定第一個和預設的標題顏色 */
}

.fc-header td:nth-child(2):before {
background: #e5989b; /* 指定第二個標題顏色 */
}

.fc-header td:nth-child(3):before {
background: #b5838d; /* 指定第三個標題顏色 */
}

.fc-header td:nth-child(4):before {
background: #6d6875; /* 指定第四個標題顏色 */
}
}