/*=== MEDIA QUERY ===*/
/* @import url("https://fonts.googleapis.com/css?family=Muli:300,400,600,700,800,900"); */
body {
    line-height: 1.5;
    font-family: "New Microsoft JhengHei", "Microsoft JhengHei", sans-serif;
}

p,
li,
input,
select,
button {
    font-family: "New Microsoft JhengHei", "Microsoft JhengHei", sans-serif;
    color: #666;
    font-size: 14px;
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "New Microsoft JhengHei", "Microsoft JhengHei", sans-serif;
    font-weight: 600;
    color: #333;
}

p {
    color: #666;
}

h1 {
    font-size: 2.5em;
}

h2 {
    font-size: 2em;
}

h3 {
    font-size: 1.5em;
}

h4 {
    font-size: 1.3em;
}

p {
    color: #888;
}

label {
    font-size: 1em;
    letter-spacing: 0;
    color: #848484;
}

.form-group label {
    font-weight: bolder;
    color: #2e2e2e;
    margin-bottom: .1rem;
}

ul.pagination li {
    margin-right: 10px;
}

ul.pagination li a {
    border-radius: 3px !important;
    font-size: 1.2em;
    padding: 0;
    height: 50px;
    width: 50px;
    line-height: 50px;
    text-align: center;
    border-color: transparent;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    color: #666;
}

ul.pagination .active a {
    background-color: #26317f !important;
    color: #fff !important;
    border-color: transparent !important;
}

ul.social-circle-icons li {
    margin-right: 7px;
}

ul.social-circle-icons li:last-child {
    margin-right: 0;
}

ul.social-circle-icons li a {
    display: block;
    font-size: 1.1em;
    line-height: 38px;
    color: #26317f;
    height: 38px;
    width: 38px;
    border: 2px solid #26317f;
    background: #fff;
    border-radius: 100%;
}

ul.social-circle-icons li a:hover {
    text-decoration: none;
    color: #fff;
    background: #26317f;
}

/**
 *
 * 基本
 *
 */
ol,
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

figure {
    margin: 0;
}

a {
    transition: all 0.3s ease-in 0s;
    color: #000;
}

iframe {
    border: 0;
}

a:focus,
a:hover {
    text-decoration: none;
    outline: 0;
    color: #26317f;
}

.form-control {
    border-radius: 2px;
    height: 50px;
    background-color: transparent;
    color: #666;
    box-shadow: none;
    font-size: 1.1em;
    border: solid 1px #e8e8e8;
}

.form-control:focus {
    color: #666;
    box-shadow: none;
    border: 1px solid #26317f;
    background-color: transparent;
}

textarea.form-control {
    padding: 20px;
}

.form-control::-webkit-input-placeholder {
    color: #666;
    opacity: 0.5;
}

/* WebKit, Blink, Edge */
.form-control:-moz-placeholder {
    color: #666;
    opacity: 0.5;
}

/* Mozilla Firefox 4 to 18 */
.form-control::-moz-placeholder {
    color: #666;
    opacity: 0.5;
}

/* Mozilla Firefox 19+ */
.form-control:-ms-input-placeholder {
    color: #666;
    opacity: 0.5;
}

/* Internet Explorer 10-11 */
.form-control::-ms-input-placeholder {
    color: #666;
    opacity: 0.5;
}

/* Microsoft Edge */
.mt-20 {
    margin-top: 20px;
}

.btn:active,
.btn:focus {
    color: #ddd;
    box-shadow: none;
}

.nice-select-white .nice-select:after {
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
}

.w-100 {
    width: 100%;
}

.margin-0 {
    margin: 0 !important;
}

button {
    cursor: pointer;
}

.btn.active:focus,
.btn:active:focus,
.btn:focus {
    outline: 0;
}

.bg-shadow {
    background-color: #fff;
    box-shadow: 0 16px 24px rgba(0, 0, 0, 0.08);
    padding: 20px;
}

.section {
    padding: 100px 0;
}

.section-sm {
    padding: 70px 0;
}

.section-xs {
    padding: 20px 0;
}

.section-title {
    position: relative;
    margin-bottom: 75px;
    text-align: center;
}

.section-title h2 {
    font-size: 2.2em;
    letter-spacing: 0.05em;
    text-align: center;
}

.section-title h2:before {
    content: " ";
    display: block;
    margin: 0 auto;
    position: absolute;
    bottom: -24px;
    left: 0;
    right: 0;
    width: 127px;
    height: 2px;
    background-color: #e0e0e0;
}

.section-title h2:after {
    content: " ";
    display: block;
    margin: 0 auto;
    position: absolute;
    bottom: -25px;
    left: 0;
    right: 0;
    width: 40px;
    height: 5px;
    background-color: #26317f;
}

.section-title p {
    font-size: 1.3em;
    line-height: 30px;
    color: #848484;
}

.overly {
    position: relative;
}

.overly:before {
    content: "";
    background: rgba(0, 0, 0, 0.51);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.page-wrapper {
    padding: 70px 0;
}

.social-media-icons ul li {
    display: inline-block;
}

.social-media-icons ul li a {
    font-size: 1.3em;
    color: #333;
    display: inline-block;
    padding: 0;
    color: #fff;
}

.social-media-icons a {
    font-size: 1.3em;
    color: #333;
    /* display: inline-block; */
    padding: 0;
    color: #fff;
}

.social-media-icons .youtube {
    /* color: #f30000!important; */
    /* border-radius: 10px; */
    /* padding:10px; */
    /* background: #f30000; */
    /* padding: 7px 10px; */
}

.social-media-icons .facebook {
    /* color: #4267b2!important; */
    /* background: #4267b2; */
    /* border-radius: 10px; */
    /* padding:10px; */
    /* padding: 7px 14px; */
}

.social-media-icons .tiktok {
    /* color: #ffffff!important; */
    /* background: #000000; */
    /* border-radius: 10px; */
    /* padding:10px; */
}

.social-media-icons .line {
    /* color: #00c300!important; */
    /* background: #00c300; */
    /* border-radius: 10px; */
    /* padding:10px; */
}

.social-media-icons .instagram {
    /* color: #f79e3b!important; */
    /* background: #f79e3b; */
    /* border-radius: 10px; */
    /* padding:10px; */
    /* background-image: url("../images/instagram_background.png"); */
    /* background-size: 100%; */
}

.social-media-icons .benliton_video {
    /* color: #d4a13b!important; */
    /* background: #d4a13b; */
    /* border-radius: 10px; */
    /* padding:10px; */
}

.social-media-icons img {
    width: 40px;
}

.social-media-icons.big-list .facebook {
    /* padding-left: 20px; */
    /* padding-right: 20px; */
}

.social-media-icons.big-list img {
    width: 90px;
    /* margin-bottom: 8px; */
}

.social-media-icons.big-list div {
    margin-bottom: 35px;
}

.social-media-icons.big-list a {
    font-size: 60px;
    line-height: 1.3;
    width: 93px;
    display: inline-block;
}

/**
 *
 * Button Styles
 *
 */
.btn {
    font-size: 1.1em;
    letter-spacing: 1px;
    display: inline-block;
    padding: 15px 30px;
    border-radius: 4px;
}

.btn-main,
.btn-main-sm {
    background: #26317f;
    color: #fff;
}

.btn-main:hover,
.btn-main-sm:hover {
    background: #082de1;
    color: #fff;
}

.btn-main-sm {
    padding: 6px 20px;
    font-size: 0.9em;
}

.btn-secondary {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.btn-secondary:hover {
    background: #26317f;
    color: #fff;
    border-color: #fff;
}

.btn-transparent {
    background: transparent;
    color: #26317f;
    border: 1px solid #26317f;
}

.btn-transparent:hover {
    background: #082de1;
    color: #fff;
}

.btn-transparent-white {
    background: transparent;
    color: #fff;
    border: 1px solid #fff;
}

.btn-transparent-white:hover {
    background: #fff;
    color: #848484;
}

.btn-transparent-black {
    background: transparent;
    color: #000000;
    border: 1px solid #c8cbd8;
}

.btn-transparent-black:hover {
    background: #fff;
    color: #3C65F5;
    border: 1px solid #3C65F5;
}

.btn-transparent-black.active {
    background: #ffffff;
    color: #3C65F5;
    border: 1px solid #3C65F5;
}

.btn-transparent-blue {
    background: transparent;
    color: #000000;
    border: 1px solid #c8cbd8;
}

.btn-transparent-blue:hover {
    background: #fff;
    color: #3C65F5;
    border: 1px solid #3C65F5;
}

.btn-transparent-blue.active {
    background: #3C65F5;
    color: #ffffff;
    border: 1px solid #3C65F5;
}

.btn-group .btn i {
    font-size: 1.2em;
    line-height: 40px;
}

.btn-group .btn:focus {
    color: #000000;
}

.btn-group .btn-transparent {
    color: #d0d0d0;
    border: 1px solid #d0d0d0;
    padding: 0;
    width: 40px;
}

.btn-group .btn-transparent:hover {
    color: #e6b322;
    background: transparent;
}

.btn-active {
    color: #e6b322;
}

.card-body.area0 {}

.btn-group .btn-transparent:hover {
    color: #e6b322;
    background: transparent;
}

.area1 {
    background-color: #ffffcc;
    padding-bottom: 0.5em;
}

.area2 {
    background-color: #ccffd9;
    padding-bottom: 0.5em;
}

.area3 {
    background-color: #ccdaff;
    padding-bottom: 0.5em;
}

.area4 {
    background-color: #ffccf9;
    padding-bottom: 0.5em;
}

.area5 {
    background-color: #e3e3a3;
    padding-bottom: 0.5em;
}

@media (max-width: 480px) {
    .btn {
        font-size: 1.3em;
        letter-spacing: 0px;
        display: inline-block;
        padding: 3px 30px;
        border-radius: 5px;
    }
}

/**
 *
 * Card
 *
 */
.card-main {
    border-radius: 2px;
    border: none;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
}

@media (max-width: 480px) {
    .card-body {
        padding: 0.5em;
    }
}

.mb-30 {
    margin-bottom: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.border-bottom {
    border-bottom: 1px solid #dedede;
}

.bl-none {
    border-left: none !important;
}

.alt-color {
    color: #c7c7c7;
}

.success {
    color: #1fcc2e;
}

.page-title {
    background: #26317f;
    padding: 35px 0;
}

.page-title h3 {
    color: #fff;
    font-size: 42px;
    letter-spacing: 0;
    line-height: 1;
    margin-bottom: 0;
}

ul.pagination li {
    margin-right: 10px;
}

ul.pagination li a {
    font-weight: 600;
    border-radius: 3px !important;
    font-size: 1.2em;
    padding: 0;
    height: 40px;
    width: 40px;
    line-height: 40px;
    text-align: center;
    border-color: transparent;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    color: #666;
}

ul.pagination li a:hover {
    background-color: #26317f !important;
    color: #fff !important;
    border-color: transparent !important;
}

ul.pagination .active a {
    background-color: #26317f !important;
    color: #fff !important;
    border-color: transparent !important;
}

ul.pagination.mobile {
    display: none;
}

@media (max-width: 768px) {
    ul.pagination.mobile {
        display: block;
    }

    ul.pagination.mobile li a {
        padding: 0;
        height: 40px;
        width: 120px;
        line-height: 40px;
        text-align: center;
        border-color: transparent;
        box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
        color: #666;
    }

    ul.pagination {
        display: none;
    }
}

.nice-select .list {
    width: 100%;
}

.slick-slide:focus {
    outline: 0;
}

.page-search {
    background: #26317f;
    padding: 30px 0;
}

.page-search .advance-search .form-group {
    margin-bottom: 0;
}

.page-search .advance-search .form-control {
    border: 1px solid #fff;
    color: #fff;
    padding: 28px 10px;
}

.page-search .advance-search ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #b9b9b9;
}

.page-search .advance-search ::-moz-placeholder {
    /* Firefox 19+ */
    color: #b9b9b9
}

.page-search .advance-search :-ms-input-placeholder {
    /* IE 10+ */
    color: #b9b9b9
}

.page-search .advance-search :-moz-placeholder {
    /* Firefox 18- */
    color: #b9b9b9
}

.bg-light {
    background: #fff;
}

.bg-title {
    background: #fadfa5;
}

.bg-gray {
    background: #F5F5F5;
}

.bg-purple {
    background: #ccd0f164;
}

.bg-1 {
    background: url("../images/home/hero.jpg");
    background-size: cover;
    background-repeat: no-repeat;
}

.bg-2 {
    background: url(../images/subscription/subscription-back.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

.bg-3 {
    background: url(../images/call-to-action/cta-background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-4 {
    background: #26317f;
}

.navigation {
    padding: 0;
}

.navigation .navbar-nav {
    text-align: center;
}

.login-button {
    border: 2px solid #dedede;
    margin-right: 8px;
    padding: 6px 20px !important;
    background-color: #fb246a;
    color: #fff;
}

.dropdown-item:focus,
.dropdown-item:hover {
    background-color: #ccd0f164;
    color: #fb246a;
}

.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
    background-color: #ccd0f164;
    color: #fb246a;
}

@media (max-width: 400px) {
    .login-button {
        display: inline-block;
        padding: 6px 45px !important;
        margin: 5px 0;
    }
}

@media (max-width: 480px) {
    .login-button {
        display: inline-block;
        padding: 6px 45px !important;
        margin: 5px 0;
    }

    .page-search .advance-search .form-control {
        border: 1px solid #fff;
        color: #fff;
        padding: 0px 10px;
    }
}

@media (max-width: 768px) {
    .login-button {
        display: inline-block;
        padding: 6px 45px !important;
        margin: 5px 0;
    }

    .navbar-brand img {
        width: 70%;
        /* margin: 0 auto; */
    }
}

@media (max-width: 992px) {
    .login-button {
        display: inline-block;
        padding: 6px 45px !important;
        margin: 5px 0;
    }

    .navbar-brand {
        /* margin-right: 0; */
        margin: 0 auto;
        text-align: center;
    }
}

@media (max-width: 1199px) {
    .navbar-brand {
        /* margin-right: 0; */
        margin: 0 auto;
    }

    .navbar-brand img {
        width: 80%;
        /* margin: 0 auto; */
    }
}

.add-button {
    background: #28a745;
    color: #fff;
    padding: 8px 20px !important;
    display: inline-block;
    float: right;
}

.add-button:hover {
    color: #fff;
}

.edit-button {
    background: #2850a7;
    color: #fff;
    padding: 8px 20px !important;
    display: inline-block;
    float: right;
}

.edit-button:hover {
    color: #fff;
}

.main-nav .nav-item .nav-link {
    font-size: 1.2em;
    line-height: 43px;
    padding: 0 20px;
    color: #252b60;
    font-weight: 500;
}

.main-nav .nav-item .nav-link span {
    margin-left: 4px;
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #fb246a;
}

.main-nav .nav-item .nav-link.dropdown-toggle {
    padding-right: 10px;
}

.main-nav .nav-item .dropdown-toggle::after {
    border: none;
}

.main-nav .nav-item.active .nav-link {
    color: #fb246a;
    font-weight: bold;
}

.main-nav .search .nav-link i {
    font-size: 1.1em;
    height: 43px;
    width: 43px;
    line-height: 43px;
    color: #26317f;
    border: 1px solid #26317f;
    border-radius: 3px;
    text-align: center;
}

.main-nav .search .input-group {
    width: 300px;
}

.main-nav .search .input-group .input-group-addon {
    background: #26317f;
    color: #fff;
    border: 1px solid #26317f;
}

.main-nav .search .input-group .input-group-addon i {
    font-size: 1.1em;
    padding-right: 5px;
    padding-left: 5px;
}

.dropdown-menu {
    padding: 0;
    border-radius: 0;
}

.dropdown-menu li:first-child {
    margin-top: 12px;
}

.dropdown-menu li:last-child {
    margin-bottom: 12px;
}

.nav-item.dropdown {
    position: relative;
}

.dropdown-item.active,
.dropdown-item:active {
    background: #26317f;
}

.dropdown-submenu.active>a {
    background: #26317f;
    color: #fff;
}

.dropdown-item {
    font-size: 1em;
    padding: 10px 60px 10px 25px;
}

@media (max-width: 1199px) {
    .main-nav .nav-item .nav-link {
        padding: 0 10px;
    }
}

@media (max-width: 992px) {
    .dropdown-item {
        padding: 10px 25px 10px 25px;
        text-align: center;
    }

    label {
        font-size: 1.1em;
    }
}

@media (max-width: 578px) {
    .main-nav .nav-item .nav-link {
        border: 1px solid #adadad;
        border-radius: 10px;
        margin-bottom: 5px;
    }
}

.dropleft .dropdown-menu,
.dropright .dropdown-menu {
    margin: 0;
}

.dropleft .dropdown-menu {
    margin-right: -1px;
}

.dropright .dropdown-menu {
    margin-left: -1px;
}

.dropleft .dropdown-toggle::before,
.dropright .dropdown-toggle::after {
    font-weight: bold;
    font-family: "FontAwesome";
    border: 0;
}

.dropleft .dropdown-toggle::before {
    content: "\f104";
    margin-right: 6px;
}

.dropright .dropdown-toggle::after {
    content: "\f105";
    margin-left: 6px;
}

@media (min-width: 992px) {
    .dropdown-slide {
        position: static;
    }

    .dropdown-slide .open>a,
    .dropdown-slide .open>a:focus,
    .dropdown-slide .open>a:hover {
        background: transparent;
    }

    .dropdown-slide.full-width .dropdown-menu {
        left: 0 !important;
        right: 0 !important;
    }

    .dropdown-slide .dropdown-menu {
        margin-top: 0;
        border-radius: 0;
        opacity: 1;
        visibility: visible;
        position: absolute;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        transition: 0.3s all;
        position: absolute;
        display: block;
        visibility: hidden;
        opacity: 0;
        transform: translateY(10px);
        transition: visibility 0.2s, opacity 0.2s, transform 500ms cubic-bezier(0.43, 0.26, 0.11, 0.99);
    }
}

@media (min-width: 992px) and (max-width: 480px) {
    .dropdown-slide .dropdown-menu {
        transform: none;
    }
}

@media (min-width: 992px) {
    .dropdown:hover>.dropdown-menu {
        display: none;
        opacity: 1;
        display: block;
        transform: translate(0px, 0px);
        opacity: 1;
        visibility: visible;
        color: #777;
        transform: translateY(0px);
    }
}

@media (max-width: 480px) {
    .navbar-toggleable-md>.container {
        margin-right: 0;
        margin-left: 0;
        padding-left: 25px;
        padding-right: 25px;
    }
}

.page-breadcrumb {
    background: none;
    margin-top: 0px;
    margin-bottom: 0;
}

.page-breadcrumb li {
    background-color: transparent;
    display: inline-block;
    list-style: none;
    font-weight: 400;
    font-size: 1em;
    letter-spacing: -0.5px;
    line-height: 2;
    margin: 0;
    padding: 0;
}

.page-breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/";
    vertical-align: baseline;
}

.page-breadcrumb li a {
    color: #888;
}

.page-breadcrumb li.active {
    color: #4f4f4f !important;
}

.table-list-container .list-table thead th {
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.table-list-container .list-table td {
    vertical-align: middle;
    padding: 20px 0px 20px 4px;
}

.priority-mark {
    float: left;
    font-size: 0.7em;
    background: #ffd438;
    border-radius: 10px;
    padding: 3px 8px;
    color: #cb0000;
    margin-right: 3px;
    font-weight: 400;
}

.delete-mark,
.copy-mark {
    text-align: center;
    /* width: 6%; */
}

.delete-mark span {
    float: left;
    width: 50%;
    margin: 0 auto;
    font-size: 1.3em;
    /* background: #99003b; */
    border-radius: 3px;
    padding: 0px 8px 8px 8px;
    color: #99003b;
    /* margin-right: 3px; */
    /* z-index: 100; */
}

.copy-mark span {
    float: left;
    width: 50%;
    margin: 0 auto;
    font-size: 1.3em;
    /* background: #99003b; */
    border-radius: 3px;
    padding: 0px 8px 8px 8px;
    color: #018615;
    /* margin-right: 3px; */
    /* z-index: 100; */
}

.edit-mark span {
    float: left;
    font-size: 1.3em;
    /* background: #99003b; */
    border-radius: 3px;
    padding: 0px 8px 8px 8px;
    color: #0f0bd5;
    margin-right: 3px;
    /* z-index: 100; */
}

.table-list-container .product-thumb {
    width: 15%;
}

tbody tr:hover .action a {
    color: #fff;
}

tbody tr:hover .action a.edit {
    background: #59d659;
}

tbody tr:hover .action a.view {
    background: #50c6e9;
}

tbody tr:hover .action a.delete {
    background: #ff5252;
}

.table-list-container .product-details {}

.table-list-container .product-details span {
    display: block;
    font-size: 1em;
    color: #848484;
}

.table-list-container .product-details span strong {
    color: #666;
    width: 30%;
    display: inline-block;
}

.table-list-container .product-details .title {
    font-size: 1.2em;
}

.table-list-container .product-details .status.active {
    color: #59d659;
}

.table-list-container .product-category {
    width: 15%;
    text-align: center;
}

.round-btn {
    float: right;
    margin-bottom: 10px;
}

.round-btn a {
    width: 65px;
    height: 30px;
    border-radius: 30px;
    font-size: 1em;
    color: #363b4d;
    text-align: center;
    display: inline-block;
}

.round-btn a.collect:hover,
.round-btn a.phone:hover,
.round-btn a.line:hover {
    color: #000000;
    background: #ffffff;
}

.round-btn a.collect {
    background: #ff5252;
    color: #fff;
}

.round-btn a.phone {
    background: #50c6e9;
    color: #fff;
}

.round-btn a.line {
    background: #59d659;
    color: #fff;
}

.round-btn a i {
    line-height: 30px;
}

.round-btn .list-inline .list-inline-item:not(:last-child) {
    margin-right: 0px;
}

.round-btn .collect,
.round-btn .phone,
.round-btn .line {
    background: #f7f7f7;
}

@media (max-width: 992px) {
    .round-btn {
        float: none;
        width: 100%;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .round-btn li {
        width: 30%;
    }

    .round-btn a {
        width: 100%;
        height: 35px;
        border-radius: 30px;
        font-size: 1.1em;
        color: #363b4d;
        text-align: center;
        display: inline-block;
        padding-top: 3px;
    }
}

.submit-coupon .form-control,
.submit-coupon .sbHolder {
    margin-bottom: 30px;
}

.submit-coupon button {
    margin-top: 20px;
}

c .deals-categories {
    padding: 100px 0 0 0;
}

.deals-categories .border-bottom {
    padding-bottom: 70px;
}

.image-cropped-transform {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 55%;
    transform: scale(0.5) translate(0, 5%);
}

.thumbnail {
    position: relative;
    width: 200px;
    height: 200px;
    overflow: hidden;
}

.thumbnail img {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 100%;
    width: auto;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.thumbnail img.portrait {
    width: 100%;
    height: auto;
}

.category-block {
    box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.09);
    padding: 20px 10px;
    border-radius: 3px;
    margin-bottom: 25px;
}

.category-block .header {
    margin-bottom: 20px;
    border-bottom: 3px solid #F4F7F9;
    text-align: center;
}

.category-block .header h4 {
    font-size: 1.3em;
    font-weight: 700;
    margin-top: 5px;
}

.category-block .header .icon-bg-1 {
    background: #988a69;
    box-shadow: 0 0 0px 4px rgba(152, 138, 105, 0.35);
}

.category-block .header .icon-bg-2 {
    background: #e49aa6;
    box-shadow: 0 0 0px 4px rgba(228, 154, 166, 0.35);
}

.category-block .header .icon-bg-3 {
    background: #a89d70;
    box-shadow: 0 0 0px 4px rgba(168, 157, 112, 0.35);
}

.category-block .header .icon-bg-4 {
    background: #a972ae;
    box-shadow: 0 0 0px 4px rgba(169, 114, 174, 0.35);
}

.category-block .header .icon-bg-5 {
    background: #db6563;
    box-shadow: 0 0 0px 4px rgba(219, 101, 99, 0.35);
}

.category-block .header .icon-bg-6 {
    background: #cc8da0;
    box-shadow: 0 0 0px 4px rgba(204, 141, 160, 0.35);
}

.category-block .header .icon-bg-7 {
    background: #bc02d3;
    box-shadow: 0 0 0px 4px rgba(188, 2, 211, 0.35);
}

.category-block .header .icon-bg-8 {
    background: #025fd3;
    box-shadow: 0 0 0px 4px rgba(2, 95, 211, 0.35);
}

.category-block .header i {
    margin-right: 6px;
    color: #fff;
    font-size: 0.95em;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    margin-bottom: 6px;
    border-radius: 40px;
}

.category-block .category-list li {
    display: block;
    font-size: 1em;
    border-bottom: 1px solid #F4F7F9;
    padding: 10px 0;
}

.category-block .category-list li:last-child {
    border: none;
}

.category-block .category-list li a {
    display: block;
    color: #777;
    font-size: 13px;
}

.category-block .category-list li a span {
    float: right;
    font-size: 0.7em;
    border-radius: 10px;
    padding: 3px 8px;
    color: #84919B;
}

.category-block .category-list li a:hover {
    text-decoration: underline;
}

.category-block .category-list li a i {
    margin-right: 6px;
    font-size: 0.9em;
    color: #26317f;
    vertical-align: middle;
}

.category-block .category-list li span.title {
    font-weight: bold;
    color: #000;
}

.main .category-block:hover {
    box-shadow: 0px 10px 30px 0px rgba(38, 29, 45, 0.2)
}

.main .category-block {
    background-color: #ccd0f164;
}

.icon {
    margin: 20px 0 20px 0;
    /* text-align: center; */
}

.icon h4 {
    margin-top: 15px;
}

@media (max-width: 576px) {
    .section-notop {
        padding: 0;
    }

    .icon {
        margin: 10px 0 10px 0px;
        /* text-align: center; */
    }

    .category-block .header {
        font-size: 1.3em;
    }

    .category-block .category-list {
        font-size: 1.2em;
    }

    .category-block .category-list li a {
        font-size: 1em;
    }
}

.search-result {
    padding: 20px;
    margin-bottom: 20px;
}

.search-result p {
    margin: 0;
}

.category-search-filter {
    background: #f7f7f7;
    padding: 20px;
}

.category-search-filter strong {
    margin: 0 5px;
}

.category-search-filter .view ul {
    display: inline-block;
}

.category-search-filter .view ul li:not(:last-child) {
    margin-right: 10px;
}

.category-search-filter .view ul li a {
    font-size: 1.1em;
}

.category-search-filter .view .view-switcher {
    background: #fff;
    padding: 10px 15px;
}

.nice-select {
    float: none;
    display: inline-block;
    border-radius: 0;
}

.nice-select .list {
    border-radius: 0;
}

.arrow-right,
.arrow-left {
    cursor: pointer;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: #025fd3;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.arrow-right {
    right: -15px;
}

.arrow-left {
    left: -15px;
}

.product-item {
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
}

.product-item .card {
    border: none;
}

.product-item .card .card-body {
    padding: 20px;
}

.product-item .card .card-body .card-title {
    font-size: 1.3em;
    margin-bottom: 5px;
    font-weight: 600;
}

.product-item .card .card-body .card-text {
    color: #777;
}

.product-item .thumb-content {
    position: relative;
}

.product-item .thumb-content .price {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #26317f;
    color: #fff;
    display: inline-block;
    padding: 4px 8px;
    font-size: 0.9em;
}

.product-item .product-meta {
    margin-bottom: 15px;
}

.product-item .product-meta li {
    margin-right: 15px;
}

.product-item .product-meta li a {
    color: #888;
    font-size: 0.9em;
}

.product-item .product-meta li a i {
    margin-right: 4px;
}

.product-item .product-ratings li {
    margin-right: 1px;
}

.product-item .product-ratings li i {
    font-size: 1.3em;
    color: #dedede;
    cursor: pointer;
}

.product-item .product-ratings .selected i {
    color: #26317f;
}

.product-details .product-title {
    font-size: 25px;
    font-weight: 600;
}

.product-details .tab-title {
    border-bottom: 1px solid #dedede;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.product-details .product-meta li {
    color: #888;
    margin-right: 25px;
}

.product-details .product-meta li a {
    color: #333;
    margin-left: 3px;
}

.product-details .content {
    padding-top: 40px;
}

.product-details .content h3 {
    font-size: 20px;
    font-weight: bold;
}

.product-details .content p {
    color: #888;
    line-height: 22px;
}

.product-details .content .nav {
    text-align: center;
    margin-bottom: 5px;
}

.product-details .content .nav .nav-item {
    margin-right: 3px;
}

.product-details .content .nav .nav-item .nav-link {
    padding: 20px 30px;
    border-radius: 0;
    background: #fff;
}

.product-details .content .nav .nav-item .nav-link:hover {
    background: #26317f;
    color: #fff;
}

.product-details .content .nav .nav-item .nav-link.active {
    background: #26317f;
}

.product-details .content .tab-content {
    background: #fff;
    padding: 30px;
}

.product-slider {
    padding: 0px 0 30px 0;
}

.product-slider .carousel-indicators li {
    background: #888;
}

.product-slider .carousel-indicators li.active {
    background: #26317f;
}

.widget {
    background: #fff;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    padding: 25px 10px 10px;
    margin-bottom: 30px;
    border-radius: 2px;
}

.widget .widget-header {
    display: block;
    font-size: 1.2em;
    font-weight: 600;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dedede;
}

.widget.category-list ul li:not(:last-child) {
    border-bottom: 1px solid #F4F7F9;
}

.widget.category-list ul li a {
    padding: 8px 0;
    display: block;
    transition: all linear 0.3s;
}

.widget.category-list ul li a span {
    float: right;
    font-size: 0.7em;
    background: #F4F7F9;
    border-radius: 10px;
    padding: 3px 8px;
    color: #84919B;
}

.widget.category-list ul li a:hover {
    color: #26317f;
}

.widget.category-list ul li a:hover span {
    background: #26317f;
    color: #fff;
}

.widget.welcome-message h2 {
    font-size: 2.2em;
    line-height: 54px;
    letter-spacing: 0.05em;
    text-align: center;
}

.widget.welcome-message p {
    font-size: 1em;
    line-height: 26px;
    letter-spacing: 0;
    color: #848484;
}

.widget.welcome-message h4 {
    text-align: center;
    letter-spacing: 0;
}

.widget.price {
    background: #5672f9;
}

.widget.price h4 {
    color: #fff;
}

.widget.price p {
    color: #fff;
    font-size: 30px;
    text-align: center;
    font-weight: bold;
    margin: 0;
}

.popup .block-1 {
    padding: 20px 80px;
    background: #F6F8FA;
}

.popup .block-1 .media .img-content {
    height: 80px;
    width: 130px;
    background: #fff;
    display: flex;
    justify-content: center;
    margin-right: 20px;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
}

.popup .block-1 .media .media-body h4 {
    font-size: 1.7em;
}

.popup .block-2 {
    padding: 50px 80px;
    background: #fff;
}

.popup .block-2 h6 {
    margin-bottom: 20px;
}

.popup .block-2 p {
    width: 100%;
    text-align: center;
    line-height: 60px;
    text-transform: uppercase;
    background: #fff6f7;
    border: 2px dashed #26317f;
    border-radius: 3px;
    margin-bottom: 40px;
}

.popup .block-2 form .form-group label {
    display: block;
    color: #666;
}

.popup .block-2 form .form-group a {
    float: right;
    margin-top: -5px;
}

.terms-condition-content p {
    line-height: 30px;
}

.package-content {
    transition: all linear 0.3s;
}

.about-content p {
    line-height: 30px;
}

.counter-content i {
    font-size: 4.3em;
    color: #26317f;
}

.counter-content span {
    font-size: 1.7em;
}

.contact-us-content h1 {
    font-size: 4.7em;
}

@media (max-width: 992px) {
    .contact-us-content h1 {
        font-size: 3.2em;
    }
}

@media (max-width: 768px) {
    .contact-us-content h1 {
        font-size: 2.85px;
    }
}

@media (max-width: 480px) {
    .contact-us-content h1 {
        font-size: 2.6em;
    }

    .product-details .product-title {
        font-size: 1.5em;
        font-weight: 600;
    }

    .product-meta .list-inline-item {
        font-size: 1.2em;
        margin-bottom: 5px;
    }
}

@media (max-width: 400px) {
    .contact-us-content h1 {
        font-size: 36px;
    }
}

form textarea {
    height: 200px;
}

.footer {
    background: #666666;
}

.footer .block h4 {
    color: #fff;
    font-size: 1.15em;
    margin-bottom: 25px;
}

.footer .block.about img {
    margin-bottom: 25px;
}

.footer .block.about p {
    line-height: 26px;
}

.footer .block ul li {
    margin-bottom: 10px;
}

.footer .block ul li a {
    display: block;
    font-size: 1em;
    color: #c2c2c2;
}

.footer .block ul li a:hover {
    color: #fb246a;
    text-decoration: underline;
}

.footer .block ul.terms-list {
    margin-top: 10px;
}

.footer .block ul.terms-list li a {
    padding-right: 10px;
}

.footer .block-2 {
    padding: 18px 30px;
    background: #46484A;
    border-radius: 2px;
}

.footer .block-2.app-promotion {
    margin-bottom: 20px;
}

.footer .block-2.app-promotion p {
    margin-left: 20px;
    color: #fff;
}

.footer .block-2.discount-coupon p {
    color: #fff;
    margin-bottom: 0;
}

.footer .block-2.discount-coupon p a {
    color: #26317f;
}

.footer-bottom {
    position: relative;
    background: #363839;
    padding: 10px 0;
}

.footer .icon a {
    color: #ffffff;
}

@media (max-width: 480px) {
    .footer-bottom {
        text-align: center;
    }
}

.footer-bottom .copyright p {
    color: #c7c7c7;
    margin-bottom: 0;
}

.footer-bottom .social-media-icons {
    margin-right: -20px;
}

@media (max-width: 992px) {
    .footer-bottom .social-media-icons {
        margin-right: 0;
    }
}

.footer-bottom .social-media-icons li {
    display: inline-block;
}

.footer-bottom .social-media-icons li a {
    color: #fff;
    padding: 0 20px;
}

.footer-bottom .social-media-icons li a:hover {
    color: #848484 !important;
    text-decoration: none;
}

.scroll-top-to {
    position: fixed;
    right: 20px;
    bottom: 50px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #26317f;
    color: #fff;
    transition: 0.3s;
    z-index: 999556;
    cursor: pointer;
    display: none;
}

.scroll-top-to:hover {
    background: #333;
}

.table-3 tr {
    margin: 1em 0;
}

.table-3 h3.title {
    display: inline-block;
}

.my-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 20px;
}

#one {
    position: sticky;
    top: 10px;
}

* {
    box-sizing: border-box;
}

dl>div {
    background: #fff;
    padding: 24px 0 0 0;
}

dt {
    background: #b8c1c8;
    border-bottom: 1px solid #989ea4;
    border-top: 1px solid #717d85;
    color: #fff;
    font:
        bold 18px/21px Helvetica,
        Arial,
        sans-serif;
    margin: 0;
    padding: 2px 0 0 12px;
    position: -webkit-sticky;
    position: sticky;
    top: -1px;
}

dd {
    font:
        bold 20px/45px Helvetica,
        Arial,
        sans-serif;
    margin: 0;
    padding: 0 0 0 12px;
    white-space: nowrap;
}

dd+dd {
    border-top: 1px solid #ccc;
}

@media (max-width: 992px) {
    .table-3 h3.title {
        font-size: 1.2em;
        margin: 3px;
        display: inline-block;
    }

    .priority-mark {
        font-size: 0.7em;
        margin-right: 5px;
    }
}

@media (max-width: 768px) {
    .scroll-top-to {
        bottom: 15px;
        right: 15px;
        width: 35px;
        height: 35px;
        line-height: 35px;
    }

    .table-3 tr {
        display: block;
        margin-top: 0px;
        margin-bottom: 0px;
        border-bottom: solid 1px #000000;
    }

    .table-3 th {
        display: none;
    }

    .table-3 td {
        font-size: 1.2em;
        padding: 0;
        line-height: 1em;
        display: flex;
        border-top: 1px solid #dee2e6;
    }

    .table-3 h3.title {
        font-size: 1.4em;
        margin: 3px;
        width: 100%;
    }

    .priority-mark {
        /* float: none; */
        font-size: 0.7em;
        padding: 5px 8px;
        /* text-align: center; */
        /* margin-bottom: 8px; */
        line-height: 1em;
    }

    .delete-mark span {
        font-size: 1.3em;
        padding: 0px 8px 0px 8px;
        margin-top: -12px;
        color: #99003b;
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: -40px;
    }

    .edit-mark {
        padding: 0 !important;
    }

    .edit-mark span {
        font-size: 1.3em;
        padding: 0px 8px 0px 8px;
        margin-top: -32px;
        color: #0f0bd5;
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 130px;
    }

    .copy-mark {
        padding: 0 !important;
    }

    .copy-mark span {
        font-size: 1.3em;
        padding: 0px 8px 0px 8px;
        margin-top: -32px;
        /* color: #0f0bd5; */
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 0px;
    }
}
}

html,
body.main {
    height: 100%;
    margin: 0;
}

body.main {
    display: flex;
    /*使物件依序排列*/
    flex-direction: column;
    /*使物件垂直排列*/
}

.wrapper {
    flex-grow: 1;
    /*可佔滿垂直剩餘的空間*/
}

.terms-condition-content {
    padding: 0 15px;
}

.terms-condition-content p {
    font-size: 1.1em;
}

/* group btn */
.btn-lg,
.btn-group-lg>.btn {
    padding: 0.5rem 1rem;
    font-size: 1.09375rem;
    line-height: 1.5;
    border-radius: 0.3rem;
}

.btn-sm,
.btn-group-sm>.btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.76563rem;
    line-height: 1.5;
    border-radius: 0.2rem;
}

.btn-group,
.btn-group-vertical {
    position: relative;
    /* display: inline-flex; */
    display: flex;
    vertical-align: middle;
}

.btn-group>.btn,
.btn-group-vertical>.btn {
    position: relative;
    flex: 1 1 auto;
    /* flex: none; */
}

.btn-group>.btn:hover,
.btn-group-vertical>.btn:hover {
    z-index: 1;
}

.btn-group>.btn:focus,
.btn-group>.btn:active,
.btn-group>.btn.active,
.btn-group-vertical>.btn:focus,
.btn-group-vertical>.btn:active,
.btn-group-vertical>.btn.active {
    z-index: 1;
}

.btn-group>.btn:not(:first-child),
.btn-group>.btn-group:not(:first-child) {
    margin-left: -1px;
}

.btn-group>.btn:not(:last-child):not(.dropdown-toggle),
.btn-group>.btn-group:not(:last-child)>.btn {
    /* border-top-left-radius: 5px;
    border-bottom-left-radius: 5px; */
    border-radius: 5px;
    margin: 5px;
}

.btn-group>.btn:not(:first-child),
.btn-group>.btn-group:not(:first-child)>.btn {
    /* border-top-left-radius: 5px;
    border-bottom-left-radius: 5px; */
    border-radius: 5px;
    margin: 5px;
}

.btn-sm+.dropdown-toggle-split,
.btn-group-sm>.btn+.dropdown-toggle-split {
    padding-right: 0.375rem;
    padding-left: 0.375rem;
}

.btn-lg+.dropdown-toggle-split,
.btn-group-lg>.btn+.dropdown-toggle-split {
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

.btn-group-vertical {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.btn-group-vertical>.btn,
.btn-group-vertical>.btn-group {
    width: 100%;
}

/* .btn-group-vertical > .btn:not(:first-child),
    .btn-group-vertical > .btn-group:not(:first-child) {
      margin-top: -1px; }
    .btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
    .btn-group-vertical > .btn-group:not(:last-child) > .btn {
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0; }
    .btn-group-vertical > .btn:not(:first-child),
    .btn-group-vertical > .btn-group:not(:first-child) > .btn {
      border-top-left-radius: 0;
      border-top-right-radius: 0; }
   */
.btn-group-toggle>.btn,
.btn-group-toggle>.btn-group>.btn {
    margin-bottom: 0;
}

.btn-group-toggle>.btn input[type="radio"],
.btn-group-toggle>.btn input[type="checkbox"],
.btn-group-toggle>.btn-group>.btn input[type="radio"],
.btn-group-toggle>.btn-group>.btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.btn-group-toggle .btn input[type="radio"],
.btn-group-toggle .btn input[type="checkbox"],
.btn-group-toggle .btn-group .btn input[type="radio"],
.btn-group-toggle .btn-group .btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.btn-sm,
.btn-group-sm>.btn {
    font-size: 0.875rem !important;
}

.btn-lg,
.btn-group-lg>.btn {
    padding: 0.58rem 1rem;
    font-size: 0.875rem !important;
}

.btn-group.btn-rounded .btn:first-child {
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
}

.btn-group.btn-rounded .btn:last-child {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
}

.group-name {
    font-size: 1.3em;
    font-weight: bold;
    color: #3C65F5;
    padding: 1em 0 0.5em 0;
}

.modal-content {
    background-color: #F8FAFF;
}

.modal-body .product-title {
    font-size: 25px;
    font-weight: 600;
}

.modal-body .tab-title {
    border-bottom: 1px solid #dedede;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.modal-body .product-meta li {
    color: #888;
    margin-right: 25px;
}

.modal-body .product-meta li a {
    color: #333;
    margin-left: 3px;
}

.modal-body .content {
    padding-top: 0px;
}

.modal-body .content h3 {
    font-size: 20px;
    font-weight: bold;
}

.modal-body .content p {
    color: #888;
    line-height: 22px;
}

.modal-body .content .nav {
    text-align: center;
    margin-bottom: 0px;
}

.modal-body .content .nav .nav-item {
    margin-right: 0px;
    width: 50%;
}

.modal-body .content .nav .nav-item .nav-link {
    padding: 20px 30px;
    border-radius: 0;
    background: #E0E6F7;
    color: #000000;
    border-left: 1px solid #E0E6F7;
    border-right: 1px solid #E0E6F7;
    border-top: 1px solid #E0E6F7;
    border-bottom: 1px solid #3C65F5;
}

.modal-body .content .nav .nav-item .nav-link:hover {
    background: #ffffff;
    color: #3C65F5;
    ;
}

.modal-body .content .nav .nav-item .nav-link.active {
    background: #fff;
    color: #3C65F5;
    border-left: 1px solid #3C65F5;
    border-right: 1px solid #3C65F5;
    border-top: 1px solid #3C65F5;
    border-bottom: 1px solid #ffffff;
}

.modal-body .content .tab-content {
    background: #ffffff;
    padding: 20px;
    border-left: 1px solid #3C65F5;
    border-right: 1px solid #3C65F5;
    border-bottom: 1px solid #3C65F5;
}

.distance-range b {
    font-size: 13px;
    color: #888;
}

.distance-range .slider.slider-horizontal {
    width: 100%;
}

.distance-range .slider-handle {
    background: #5672f9;
}

.distance-range .slider-track {
    margin-top: -2px;
    height: 5px;
    box-shadow: none;
    border-radius: 0;
    background: #f5f5f5;
}

.distance-range .slider-selection {
    background: #dedede;
    box-shadow: none;
}

.new-immigrant .page-search .advance-search .form-control {
    padding: 37px 10px;
}

.new-immigrant .page-search .advance-search .btn {}

.new-immigrant span.note {
    font-size: 0.8em;
    display: block;
}

.crop-image {
    position: relative;
    width: 100%;
    padding-top: 83%;
    /* Adjust based on the aspect ratio */
    overflow: hidden;
}

.crop-image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: auto;
    /* height: 100%; */
}

span.noted {
    color: #ff3333;
}

ol.list-group-numbered {
    list-style: decimal inside;
}

.modal-body .content .nav .nav-item .nav-link {
    font-size: 1.3em;
}

a.nav-link.text-white.login-button {
    width: 100%;
}

.modal-body {
    padding: 0.5em;
}

.modal-body .content .tab-content {
    padding: 0.5em;
}
}

.btn-home .nav-item {
    padding: .25rem .55rem;
    font-size: 1.25rem;
    line-height: 1;
    /* background-color: rgba(0, 0, 0, .0);
    border: 1px solid rgba(0, 0, 0, .1);
    border-radius: .25rem; */
}

.slider-labels {
    margin-top: 10px;
}

.caption {
    color: #878888;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a.map-link,
a.web-link {
    color: #007bff !important;
    margin-right: 1.5em !important;
    display: inline-block !important;
}

.category-block .category-list li a.map-link i,
.category-block .category-list li a.web-link i {
    margin-right: 1px;
    font-size: 1em;
    color: #007bff;
    vertical-align: baseline;
}

.td.add-list a {
    color: #ababab;
    ;
}

.td.add-list:hover a {
    color: #fd2929;
}

.td.added-list a {
    color: #fd2929;
}

.td.added-list a:hover {
    color: #fd2929;
}

.td.unview {
    color: #ababab;
}

.td.viewed {
    color: #333;
}

.work-area .group-name {
    padding: 10px 0 5px 10px;
}

.work-area .area1 {
    background-color: #ffffcc80;
    width: 100%;
    padding: 10px;
}

.work-area .area2 {
    background-color: #ccffd980;
    width: 100%;
    padding: 10px;
}

.work-area .area3 {
    background-color: #ccdaff80;
    width: 100%;
    padding: 10px;
}

.work-area .area4 {
    background-color: #ffccf980;
    width: 100%;
    padding: 10px;
}

.work-area .area5 {
    background-color: #e3e3a380;
    width: 100%;
    padding: 10px;
}

#pills-trems-tab,
#pills-privacy-tab {
    font-size: 2em;
    word-break: break-all;
}

.is-disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.isDisabled>a {
    color: currentColor;
    display: inline-block;
    /* For IE11/ MS Edge bug */
    pointer-events: none;
    text-decoration: none;
}

@media (max-width: 480px) {
    .table-list-container .list-table td {
        vertical-align: middle;
        padding: 15px 0px 15px 4px;
    }

    .td.add-list a {
        /* font-size: 1.3em; */
        padding: 0px 8px 0px 8px;
        margin-top: -25px;
        /* color: #99003b; */
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 46px;
    }

    .td.added-list a {
        /* font-size: 1.3em; */
        padding: 0px 8px 0px 8px;
        margin-top: -25px;
        /* color: #99003b; */
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 46px;
    }

    .td.add-list {
        padding: 0 !important;
    }

    .td.added-list {
        padding: 0 !important;
    }

    .unview span {
        /* font-size: 1.3em; */
        padding: 0px 8px 0px 8px;
        margin-top: -10px;
        /* color: #0f0bd5; */
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 85px;
    }

    .viewed span {
        /* font-size: 1.3em; */
        padding: 0px 8px 0px 8px;
        margin-top: -10px;
        /* color: #0f0bd5; */
        margin-right: 3px;
        z-index: 100;
        position: absolute;
        right: 85px;
    }

    a.map-link {
        margin-left: 0em !important;
        /* display: inline-block; */
    }

    /* .product-meta a.map-link {
        margin-left: 0em !important;
    } */
}

/* Hide the default radio button */
input[type="radio"],
input[type="checkbox"] {
    display: none;
}

input[type="radio"].form-check-input,
input[type="checkbox"].form-check-input,
.loggedin-forgot input[type="checkbox"] {
    display: inline-block;
}

.inline-checkbox {
    /* display: inline-block; */
    /* margin-left: 5em; */
    display: block;
    float: right;
    font-size: 0.9em;
}

.form-check-label {
    margin-left: -0.4em;
}

/* Style for the label that will represent the radio button */
.radio-label {
    display: inline-block;
    margin-bottom: 5px;
    margin-right: 10px;
    padding: 5px 20px;
    border: 2px solid #ddd;
    border-radius: 15px;
    cursor: pointer;
}

/* Style when the radio button is checked */
input[type="radio"]:checked+.radio-label,
input[type="radio"]:checked+.btn-transparent-black,
input[type="checkbox"]:checked+.btn-transparent-black {
    border-color: #000000;
    background-color: #3C65F5;
    color: white;
}

.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 0.5rem 1.25rem 0rem 1.25rem;
}

.modal-footer .save {
    padding: 0.5rem 0.5rem;
    /* margin: -0.5rem -19.5rem -0.5rem auto; */
}

@media (max-width: 480px) {
    .modal-footer .save {
        padding: 0.5rem 0.5rem;
        /* margin: -0.5rem -10.5rem -0.5rem auto; */
    }
}

.modal-footer .cancel {
    padding: 0.5rem 0.5rem;
    /* margin: -0.5rem -0.5rem -0.5rem auto; */
}

.modal-footer {
    border-top: 0px;
}

button.save,
button.cancel {
    /* background-color: #ffffff !important; */
    border: 1px solid #000000;
}

.save .fa-check {
    color: #159b20;
    margin-right: 0.3em;
}

.cancel .fa-times {
    color: #ff3333;
    margin-right: 0.3em;
}

.save,
.cancel {
    /* float: right; */
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .8;
}

/*18禁內容提示視窗樣式*/
.r18-prompt {}

.r18-prompt .modal {
    z-index: 1049;
}

.r18-prompt .modal.show {
    top: 10%;
}

.r18-prompt .icon-lock {
    margin: 0 auto;
    width: 40%;
    max-width: 155px;
    background: url("../images/ico-r18-lock.svg") no-repeat center center;
    background-size: auto;
    font-size: 0;
    text-indent: -9999px;
}

.r18-prompt .icon-lock::before {
    content: "";
    display: block;
    padding-bottom: 145%;
}

.r18-prompt .warning-text {
    font-size: 21px;
    font-family: "Microsoft YaHei", sans-serif;
    margin-top: 15px;
}

.r18-prompt .btn.btn-lg {
    font-size: 1.25rem !important;
}

.r18-prompt .modal-footer {
    flex-wrap: wrap;
    padding: 15px;
}

.r18-prompt .modal-footer .btn {
    margin: 5px;
}

.r18-prompt~.modal-backdrop.show {
    opacity: 0.85;
}

@media (min-width: 567px) {
    .r18-prompt .modal-dialog {
        max-width: 465px;
    }
}

.td.description {
    padding-right: 10px !important;
}

.description .categories {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 479px;
}

/*TD無資料時，不顯示*/
@media (max-width: 768px) {
    .td.no-data {
        display: none;
    }

    .description .categories {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.4em;
    }

    .td.description {
        padding-right: 0px !important;
        max-width: 768px;
    }
}

/*圖片 modal*/
.modal {
    display: none;
    position: fixed;
    z-index: 1050;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
}

.modal-content {
    position: absolute;
    /* 改為絕對定位 */
    max-width: 90%;
    /* max-height: 90%; */
    transition: transform 0.25s ease;
    /* 添加過渡效果 */
    /* cursor: grab; 提示可拖動 */
    top: 50%;
    /* 垂直置中 */
    left: 50%;
    /* 水平置中 */
    transform: translate(-50%, -50%);
    /* 調整位置使其置中 */
    background-color: #ffffff;
    border-radius: .3rem;
}

#imageModal .close {
    position: absolute;
    top: 5%;
    right: 5%;
    cursor: pointer;
    font-size: 30px;
    color: #ffffff;
    background: #025fd3;
    border-radius: 50%;
    padding: 5px 10px 10px;
    z-index: 100;
}

.product-slider .img-fluid,
.widget .img-fluid {
    cursor: pointer;
    /* margin: 10px; */
}