@charset "UTF-8";
/* *************************************
//
//   KGIL-Component -- 商品表格
//   -> 凱基人壽 - 
//
//   00.Global
//   01.Button
//   02.contetn-section
//   03.頁面設定（modal,table）
//   
//   
//
//
// ************************************/
/* -------------------------------------
//   0.Global
// -----------------------------------*/
/* -------------------------------------
//   01.Button
// -----------------------------------*/
.kgil-product-no-result {
  color: #dc3545;
  font-size: 1rem;
  font-weight: 500;
  text-align: center;
  line-height: 130%;
  letter-spacing: 0.02em;
}

.kgil-search-product-table .dropdown .btn {
  height: auto;
  min-height: 50px;
}
.kgil-search-product-table .btn--white,
.kgil-search-product-table .btn--white:focus {
  background-color: white;
  color: #04327a;
  font-weight: 500;
  font-size: 1.125em;
  line-height: 1.5;
  letter-spacing: 0.12em;
  border-color: #04327a;
}
.kgil-search-product-table .btn--white:hover {
  background-color: #04327a;
  border-color: #04327a;
  color: white;
  border-radius: 0;
}
@media (max-width: 1024px) {
  .kgil-search-product-table .btn--white:hover {
    background-color: white;
    color: #04327a;
    border-color: #04327a;
  }
  .kgil-search-product-table .btn--white:hover i {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%2304327A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}

/* -------------------------------------
//   02.Content-section
// -----------------------------------*/
.kgil-search-product-table .product-result-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.kgil-search-product-table .product-result-content.show {
  display: block;
}
.kgil-search-product-table .content-switcher-dropdown .dropdown-menu {
  opacity: 0;
  visibility: hidden;
}
.kgil-search-product-table .content-switcher-dropdown.show .dropdown-menu {
  opacity: 1;
  visibility: visible;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* -------------------------------------
//   03.頁面設定（modal,table)
// -----------------------------------*/
/* 設定 */
@media (min-width: 1024px) {
  .modal-xxl {
    max-width: 80%;
  }
}
@media (min-width: 1200px) {
  .modal-xxl {
    max-width: 1174px;
  }
}

/* table */
@media (min-width: 1024px) {
  .scrollerTable.scrollerTable__008 .scrollerTable__table {
    overflow-y: hidden;
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__col-1 {
    min-width: 33.3%;
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__col-2 {
    min-width: 33.3%;
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__col-3 {
    min-width: 33.4%;
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__clone-table .scrollerTable__table, .scrollerTable.scrollerTable__008 .scrollerTable__tbody, .scrollerTable.scrollerTable__008 .scrollerTable__thead {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__clone-action-table .scrollerTable__thead, .scrollerTable__008.scrollerTable .scrollerTable__clone-action-table .scrollerTable__tbody {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__008 .external-scroll_x.scroll-scrollx_visible {
    left: 0px; /*第1個欄位寬度*/
    width: calc(100% - 0px - 0px); /*第1個欄位及最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__clone-table {
    width: 0px !important; /*第1個欄位寬度*/
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__clone-action-table {
    width: 0px !important; /*最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__008 .scrollerTable__th-sort .icon-up,
  .scrollerTable.scrollerTable__008 .scrollerTable__th-sort .icon-down {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}
@media (min-width: 1024px) {
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__table {
    overflow-y: hidden;
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__col-1 {
    min-width: 50%;
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__col-2 {
    min-width: 50%;
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__clone-table .scrollerTable__table,
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__tbody,
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__thead {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__clone-action-table .scrollerTable__thead,
  .scrollerTable__modal-rate.scrollerTable .scrollerTable__clone-action-table .scrollerTable__tbody {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal-rate .external-scroll_x.scroll-scrollx_visible {
    left: 0px;
    /*第1個欄位寬度*/
    width: calc(100% - 0px - 0px);
    /*第1個欄位及最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__clone-table {
    width: 0px !important;
    /*第1個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__clone-action-table {
    width: 0px !important;
    /*最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__th-sort .icon-up,
  .scrollerTable.scrollerTable__modal-rate .scrollerTable__th-sort .icon-down {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}
@media (min-width: 1024px) {
  .scrollerTable.scrollerTable__007 .scrollerTable__table {
    overflow-y: hidden;
  }
  /* ===== 8 欄（總和 100%）===== */
  .scrollerTable.scrollerTable__007 .scrollerTable__col-1 {
    min-width: 13.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-2 {
    min-width: 12%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-3 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-4 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-5 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-6 {
    min-width: 15.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-7 {
    min-width: 15.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__col-8 {
    min-width: 8.5%;
  }
  /* ===== 9 欄：表格內存在 col-min 時覆蓋（總和 100%）===== */
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-1 {
    min-width: 13%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-2 {
    min-width: 11.5%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-3 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-4 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-5 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-6 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-7 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-8 {
    min-width: 8%;
  }
  .scrollerTable.scrollerTable__007:has(.scrollerTable__col-min) .scrollerTable__col-min {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__clone-table .scrollerTable__table, .scrollerTable.scrollerTable__007 .scrollerTable__tbody, .scrollerTable.scrollerTable__007 .scrollerTable__thead {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__clone-action-table .scrollerTable__thead, .scrollerTable__007.scrollerTable .scrollerTable__clone-action-table .scrollerTable__tbody {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__007 .external-scroll_x.scroll-scrollx_visible {
    left: 0px; /*第1個欄位寬度*/
    width: calc(100% - 0px - 0px); /*第1個欄位及最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__clone-table {
    width: 0px !important; /*第1個欄位寬度*/
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__clone-action-table {
    width: 0px !important; /*最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__007 .scrollerTable__th-sort .icon-up,
  .scrollerTable.scrollerTable__007 .scrollerTable__th-sort .icon-down {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}
@media (min-width: 1024px) {
  .scrollerTable.scrollerTable__modal001 .scrollerTable__table {
    overflow-y: hidden;
  }
  /* ===== 7欄（總和 100%）===== */
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-1 {
    min-width: 9.75%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-2 {
    min-width: 9.5%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-3 {
    min-width: 14%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-4 {
    min-width: 14%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-5 {
    min-width: 15.5%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-6 {
    min-width: 17.5%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-7 {
    min-width: 18.5%;
  }
  /* ===== 8 欄：表格內存在 col-min 時覆蓋（總和 100%）===== */
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-1 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-2 {
    min-width: 9.5%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-3 {
    min-width: 11%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-4 {
    min-width: 11%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-5 {
    min-width: 16%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-6 {
    min-width: 13.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-7 {
    min-width: 13.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-min {
    min-width: 13%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__clone-table .scrollerTable__table,
  .scrollerTable.scrollerTable__modal001 .scrollerTable__tbody,
  .scrollerTable.scrollerTable__modal001 .scrollerTable__thead {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__clone-action-table .scrollerTable__thead,
  .scrollerTable__modal001.scrollerTable .scrollerTable__clone-action-table .scrollerTable__tbody {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal001 .external-scroll_x.scroll-scrollx_visible {
    left: 0px;
    /*第1個欄位寬度*/
    width: calc(100% - 0px - 0px);
    /*第1個欄位及最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__clone-table {
    width: 0px !important;
    /*第1個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__clone-action-table {
    width: 0px !important;
    /*最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__th-sort .icon-up,
  .scrollerTable.scrollerTable__modal001 .scrollerTable__th-sort .icon-down {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}
@media (min-width: 1200px) {
  /* ===== 7欄（調整欄位寬度）===== */
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-1 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-2 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-3 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-4 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-5 {
    min-width: 12%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-6 {
    min-width: 17.5%;
  }
  .scrollerTable.scrollerTable__modal001 .scrollerTable__col-7 {
    min-width: 18.5%;
  }
  /* ===== 8 欄：表格內存在 col-min 時覆蓋（總和 100%）===== */
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-1 {
    min-width: 9.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-2 {
    min-width: 11.5%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-3 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-4 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-5 {
    min-width: 11.75%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-6 {
    min-width: 11.25%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-7 {
    min-width: 11.5%;
  }
  .scrollerTable.scrollerTable__modal001:has(.scrollerTable__col-min) .scrollerTable__col-min {
    min-width: 14.75%;
  }
}
@media (min-width: 1024px) {
  .scrollerTable.scrollerTable__modal002 .scrollerTable__table {
    overflow-y: hidden;
  }
  /* ===== 7欄（總和 100%）===== */
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-1 {
    min-width: 9.75%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-2 {
    min-width: 9.5%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-3 {
    min-width: 14%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-4 {
    min-width: 14%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-5 {
    min-width: 15.5%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-6 {
    min-width: 17.5%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-7 {
    min-width: 18.5%;
  }
  /* ===== 8 欄：表格內存在 col-min 時覆蓋（總和 100%）===== */
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-1 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-2 {
    min-width: 9.5%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-3 {
    min-width: 11%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-4 {
    min-width: 11%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-5 {
    min-width: 16%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-6 {
    min-width: 13.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-7 {
    min-width: 13.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-min {
    min-width: 13%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__clone-table .scrollerTable__table,
  .scrollerTable.scrollerTable__modal002 .scrollerTable__tbody,
  .scrollerTable.scrollerTable__modal002 .scrollerTable__thead {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__clone-action-table .scrollerTable__thead,
  .scrollerTable__modal002.scrollerTable .scrollerTable__clone-action-table .scrollerTable__tbody {
    min-width: 0px;
  }
  .scrollerTable.scrollerTable__modal002 .external-scroll_x.scroll-scrollx_visible {
    left: 0px;
    /*第1個欄位寬度*/
    width: calc(100% - 0px - 0px);
    /*第1個欄位及最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__clone-table {
    width: 0px !important;
    /*第1個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__clone-action-table {
    width: 0px !important;
    /*最後一個欄位寬度*/
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__th-sort .icon-up,
  .scrollerTable.scrollerTable__modal002 .scrollerTable__th-sort .icon-down {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l7 7 7-7' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}
@media (min-width: 1200px) {
  /* ===== 7欄（調整欄位寬度）===== */
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-1 {
    min-width: 10%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-2 {
    min-width: 12.5%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-3 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-4 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-5 {
    min-width: 12%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-6 {
    min-width: 17.5%;
  }
  .scrollerTable.scrollerTable__modal002 .scrollerTable__col-7 {
    min-width: 18.5%;
  }
  /* ===== 8 欄：表格內存在 col-min 時覆蓋（總和 100%）===== */
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-1 {
    min-width: 9.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-2 {
    min-width: 11.5%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-3 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-4 {
    min-width: 14.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-5 {
    min-width: 11.75%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-6 {
    min-width: 11.25%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-7 {
    min-width: 11.5%;
  }
  .scrollerTable.scrollerTable__modal002:has(.scrollerTable__col-min) .scrollerTable__col-min {
    min-width: 14.75%;
  }
}

.kgil-search-product-table .scrollerTable__item-val span,
[data-comp-name="modal"].kgil-table-rate div[data-wrapper-table] .scrollerTable__item-val span,
[data-comp-name="modal"].kgil-table01 div[data-wrapper-table] .scrollerTable__item-val span {
    white-space: pre-line;
}
/*# sourceMappingURL=kgil-search-product-table.css.map */