/* 安納塔拉 ANANTARA */
.anantara {
    --primary-color: #b5967b;
    --primary-dark: #8f694c;
    --primary-light: #a38a77;

    color: #231815;
}
/* 昇恆昌 RICHCLUB */
.richclub {
    --primary-color: #51437d;
    --primary-dark: #3f1f34;
    --primary-light: #73809f;
    --border-color: #3f1f34;

    color: #231815;
}
/* 萬豪 MARRIOTT */
.marriott{
    --primary-color: #638d97;
    --primary-dark: #638d97;
    --primary-light: #796a56;
    --border-color: #638d97;

    color: #231815;
}

/* 通用 */
.text-primary       { color: var(--primary-color); }
.text-primary-dark  { color: var(--primary-dark); }
.text-primary-light { color: var(--primary-light); }
.text-border    {
    border: var(--primary-color) 1px solid;
    border-radius: 6px;
}
.text-larger    {font-size: 1.3em;}
.-indent-1      { text-indent: -1em; margin-left: 1em;}
.tracking-tight { letter-spacing: -0.01em;}
.items-baseline { align-items: baseline; }
.hr-custom      { 
    width: 26%; 
    border-color: var(--primary-light);
    border-width: 0.5px;
    margin-inline: auto;
    margin-block: 20px;
}
.bg-gray    { background-color: #f0f0f0;}

.border-b-custom   { border-bottom: 2px solid var(--border-color);}


.hero-title-container {
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    top: 10%;
    font-size: 20px;
    line-height: 1.5;
    white-space: nowrap;
}
.hero-title-img {
    width: 90%;
    display: inline-block;
    margin-bottom: 10px;
}
.hero-title-container .text {
    margin-bottom: 4px;
}
@media screen and (min-width: 640px) {
    .hero-title-container {
        left: 10%;
        font-size: 28px;
        transform: translateX(0%);
        text-align: left;
    }
    .hero-title-container .text {
        margin-bottom: 8px;
    }
    .hero-title-img {
        width: 60%;
        margin-bottom: 32px;
    }
}
@media screen and (min-width: 768px) {
    .hero-title-container {
        top: 18%;
        left: 16%;
        font-size: 32px;
    }
    .hero-title-img {
        width: 50%;
    }
}

@media screen and (min-width: 1280px) {
    .hero-title-container {
        top: 24%;
        font-size: 36px;
        left: 24%;
    }
}

main .title-container {
    font-size: 18px;
}
main .title-container em{
    font-style: normal;
    font-size: 1.3em;
}
main .title-container .items-baseline {
    align-items: center;
}

.icon-info {
    width: 46px;
    margin-right: 10px;
}
.icon-info + div {
    min-width: 240px;
}

@media screen and (min-width: 768px) {
    main .title-container {
        font-size: 22px;
    }
    main .title-container .items-baseline {
        align-items: baseline;
    }
}

.club-box-container {
    width: 100%;
}
.club-title-container {
    flex-wrap: wrap;
    gap: 2px;
}
.club-title-container .title-tag {
    background-color: var(--primary-color);
    padding: 2px 16px;
    border-bottom-right-radius: 10px;
    flex-shrink: 0;
    margin-bottom: 4px;
}
.club-title-container .title-text {
    font-size: 22px;
}
.club-title-container .title-text-sm {
    font-size: 13px;
}
.club-title-min em{
    font-style: normal;
    font-weight: 500;
    font-size: 1.2em;
}
.custom-num-list > li {
  counter-increment: item;
  position: relative;
  padding-left: 1.3em;
  margin-bottom: 4px;
  line-height: 1.6;;
}

.custom-num-list > li::before {
  content: counter(item);
  position: absolute;
  left: 0;
  top: 0.34em;

  width: 1.2em;
  height: 1.2em;
  color: #fff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 0.8em;
}
.custom-num-list.gold > li::before{ background-color: #b5967b; }
.custom-num-list.purple1 > li::before{ background-color: #73809f; }
.custom-num-list.purple2 > li::before{ background-color: #9889ac; }
.custom-num-list.blue > li::before{ background-color: #638d97; }


@media screen and (min-width: 768px) {
    .club-box-container.wide {
        width: 100%;
    }
    .club-box-container {
        width: 50%;
    }
    .club-title-container {
        gap: 4px;
    }
    .club-title-container .title-tag {
        margin-bottom: 0;
    }
}


/* 安納塔拉 ANANTARA */
.anantara .title-container .title-logo{
    width: 20%;
}
.anantara .club-title-min {
    padding-left: 10px;
    padding-block: 2px;
    background: #9E8A30;
    background: linear-gradient(90deg, rgba(158, 138, 48, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%);
}
.btn-travel { 
    width: 224px; 
}
.btn-travel .icon{
    position: absolute;
    right: 10px;
} 
@media screen and (min-width: 640px) {
    /* .btn-travel .icon{
        position: relative;
        right: auto;
    }  */
}

/* 昇恆昌 RICHCLUB */
.richclub .bg-gradient  {
    background: #E6E4EC;
    background: linear-gradient(90deg, rgba(230, 228, 236, 0) 0%, rgba(230, 228, 236, 1) 25%, rgba(230, 228, 236, 1) 75%, rgba(230, 228, 236, 0) 100%);
}
.richclub .title-container .title-logo{
    width: 20%;
}
.richclub .border-decor {
    background-color: #f7f7f7;
    height: 6px;
    width: 100%;
}
.richclub .card {
    background-color: #fff;
    padding: 27px 10px;
    width: 80%;
}
.richclub .card-container {
    align-items: center;
}
.richclub .card-title {
    font-size: 18px;
    color: var(--primary-color);
    font-weight: 600;
    text-align: center;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--primary-light);
}
.richclub .decor-title-container {
    height: 28px;
    border-bottom: 1px solid var(--primary-light);
}
.richclub .decor-title {
    background: #9889AC;
    background: linear-gradient(90deg, rgba(152, 137, 172, 0.15) 0%, rgba(152, 137, 172, 1) 25%);
    padding-left: 30px;
    padding-right: 10px;
}
.richclub .table-title {
    border-bottom: 1px solid var(--primary-light);
}
.richclub-table td{
    padding: 20px 2px;
    border-top: 1px solid #999a9a;
}
.richclub-table tr td:first-child {
    width: 25%;
}
.richclub-table td li {
    display: inline-table;
    min-width: 182px;
    margin-left: 1.5em;
}
.richclub-table .mobile-hidden {
    display: none;
}

.custom-list-star {
  list-style: none;
  padding-left: 0;
}

.custom-list-star li {
  position: relative;
  padding-left: 1rem;
  margin-bottom: 4px;
}
.custom-list-star li.list-none::before{
    background-image: url();
}
.custom-list-star li::before {
  content: "";
  position: absolute;
  left: -1rem;
  top: 0.32em;
  width: 0.8rem;
  height: 0.8rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9.98 9.97'%3E%3Cpath fill='%2373809f' d='M9.98 5l-.09.1c-1.49.43-2.82.69-3.76 2.04-.58.84-.71 1.85-1.06 2.79-.11.07-.18.03-.23-.08-.45-1.15-.42-2.1-1.32-3.1-1.05-1.18-2.08-1.12-3.41-1.63-.15-.06-.17-.18-.03-.26 1.09-.35 2.2-.52 3.08-1.3 1.07-.94 1.29-2.14 1.67-3.45.08-.15.21-.15.27.02.22.58.33 1.25.56 1.84.45 1.17 1.36 2 2.54 2.4.52.18 1.14.29 1.64.49.08.03.08.04.12.11v.04Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 768px) {
    .richclub .bg-gradient  {
        background: #E6E4EC;
        background: linear-gradient(90deg, rgba(230, 228, 236, 0) 0%, rgba(230, 228, 236, 1) 25%, rgba(230, 228, 236, 1) 75%, rgba(230, 228, 236, 0) 100%);
    }
    .richclub .card-container {
        align-items: stretch;
    }
    .richclub .card {
        flex: 1 1 0;
        margin-inline: 0;
    }
    .richclub .card-title {
        font-size: 20px;
    }
    .richclub-table td{
        padding: 20px 6px;
    }
}
@media screen and (min-width: 992px) {
    .richclub-table tr td:first-child {
        width: 13%;
    }
     .richclub-table .mobile-hidden {
        display: inline-table;
    }
}


/* 萬豪 MARRIOTT */
.marriott .title-container .title-logo{
    width: 28%;
}
.marriott .club-title-min-text {
    background: #9E8A30;
    background: linear-gradient(90deg, rgba(158, 138, 48, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%);
    padding: 4px;
}
.marriott .club-box-container .club-title-min{
    flex-direction: column;
    display: flex;
    align-items: flex-start;
}
.marriott .club-title-min .badge {
    background-color: #c4ad82;
    color: white;
    font-size: 0.9em;
    margin-right: 8px;
    padding: 6px 12px;
    display: inline-block;
}
.marriott .special-date-table-container {
    overflow-x: auto;
    margin-bottom: 10px;
}
.marriott .special-date-table {
    min-width: 600px;
}
.marriott .special-date-table th {
    padding: 8px 4px;
    border-bottom: 2px solid #888888;
}
.marriott .special-date-table td {
    padding: 8px;
    border-top: 1px solid #888888;
    vertical-align: top;
} 
.marriott .date-list > li {
    display: flex;
}
.marriott .date-list .date {
    min-width: 140px;
    margin-right: 16px;
}
.marriott .ps-border {
    font-size: 14px;
    color: rgb(136 136 136 / var(--tw-text-opacity, 1));
    border: 1px solid rgb(136 136 136 / var(--tw-text-opacity, 1));
    border-radius: 10px;
    padding: 10px;
}
.marriott .info-list-item {
    min-width: 0;
}

@media screen and (min-width: 340px) {
    .marriott .info-list-item {
        min-width: 324px;
    }
}
@media screen and (min-width: 640px) {
    .marriott .club-box-container .club-title-min{
        display: block;
    }
    .marriott .club-title-min {
        background: #9E8A30;
        background: linear-gradient(90deg, rgba(158, 138, 48, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%);
    }
    .marriott .club-title-min-text {
        background: transparent;
    }
    .marriott .club-title-min .badge {
        padding: 8px 12px;
    }
}