/* Add here all your CSS customizations */

@media (max-width: 992px) {
    #header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
    }
}
@media (min-width: 992px) {
    #header .header-nav-main nav > ul > li > a {
        font-size: 16px;
    }
    #header .header-nav-main nav > ul > li.dropdown .dropdown-menu li{
        line-height: 30px;
    }
    #header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a {
        font-size: 1em;
    }
    #header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a:hover {
        background-color: #f1f1f1!important;
        color: black!important;
    }
}

html .btn-primary:hover, html .btn-primary.hover {
    background-color: #ab9168;
    border-color: #8b7452;
    color: #FFF;
}

html .btn-primary {
    background-color: #a16b01;
    border-color: #a16b01;
    color: #FFF;
}

.page-header.page-header-modern.page-header-background.page-header-background-md {
    padding: 100px 0;
}

.overlay.overlay-op-5:hover:before, .overlay.overlay-op-5.overlay-show:before, .overlay.overlay-op-5.show:before {
    opacity: 0.4;
}

.container, .container-lg, .container-md, .container-sm {
    max-width: 1240px;
}

@media (max-width: 992px) {
    .container, .container-lg, .container-md, .container-sm {
        max-width: 100%;
    }
    .page-header.page-header-modern.page-header-background.page-header-background-md {
        padding: 170px 0 60px 0;
    }
}

.shop table.cart .product-name {
    width: auto;
}

.shop table.cart .product-thumbnail {
    width: 20%;
}

.shop table.cart img {
    height: auto;
    width: 100%;
}

.process .active {
    background-color: #8b7452;
}

.process .active .active {
    color: white;
}

.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show>.btn-info.dropdown-toggle {
    color: #fff;
    background-color: #b99b6e;
    border-color: #b99b6e;
}

.btn-info.focus, .btn-info:focus {
    background-color: #b99b6e;
    border-color: #b99b6e;
}

.form-control-lg {
    font-size: 1rem;
}

.form-control:not(.form-control-sm):not(.form-control-lg) {
    font-size: 0.95rem;
    line-height: 1.85;
}

.btn-primary.focus, .btn-primary:focus {
    color: #fff;
    background-color: #8a7452;
    border-color: #8a7452;
}

html .btn-primary:active, html .btn-primary.active {
    background-color: #8a7452 !important;
    background-image: none !important;
    border-color: #8a7452 #8a7452 #004466 !important;
}

.featured-boxes-modern-style-primary .featured-box {
    background: #ededed;
}

.featured-boxes-modern-style-2 .featured-box:before {
    content: '';
    position: absolute;
    top: 6px;
    right: 6px;
    bottom: 6px;
    left: 6px;
    background: #FFF;
}

.page-link {
    color: #8b7452;
}

@media (max-width: 991px) {
    #header .header-nav-main nav > ul li {
        padding: 8px;
    }
}

@media (min-width: 992px) {
    #header .header-nav-main nav > ul > li.dropdown .dropdown-menu {
        border-top: none;
    }

    #header .header-nav-main-effect-1 nav > ul > li.dropdown:hover > .dropdown-menu, #header .header-nav-main-effect-1 nav > ul > li.dropdown.open > .dropdown-menu, #header .header-nav-main-effect-1 nav > ul > li.dropdown.accessibility-open > .dropdown-menu {
        background-color: #fff8eb;
    }

    #header .header-nav-main nav > ul > li > a {
        padding: 0.5rem 0.6rem;
    }
}

body {
    font-family: "微軟正黑體", Arial, sans-serif;
}

.lead {
    font-weight: 400;
}

p {
    color: #555;
}

.row>* {
    padding-right: calc(var(--bs-gutter-x) * .9);
    padding-left: calc(var(--bs-gutter-x) * .9);
}

.text-4 {
    font-size: 1.3em !important;
}

.text-3 {
    font-size: 0.95rem !important;
}

@media (min-width: 1200px) {
    .container:not(.container-bs):not(.container-xl-custom):not(.container-xxl-custom) {
        max-width: 1240px;
    }
}

.featured-box {
    text-align: left;
}

.featured-box label{
    padding: 5px;
    font-size: 0.95rem;
}

.social-icons li a {
    line-height: 32px;
}

.social-icons li a .fa-facebook-f{
    color: #345baa!important;
}
.social-icons li a:hover .fa-facebook-f{
    color: white!important;
}
.social-icons li:hover.social-icons-facebook a {
    background: #345baa !important;
}

.social-icons li a .fa-instagram{
    color: #cd3280!important;
}
.social-icons li a:hover .fa-instagram{
    color: white!important;
}
.social-icons li:hover.social-icons-twitter a {
    background: #cd3280 !important;
}

.social-icons li a .fa-line{
    color: #08bc04!important;
}
.social-icons li a:hover .fa-line{
    color: white!important;
}
.social-icons li:hover.social-icons-linkedin a {
    background: #08bc04 !important;
}

.social-icons li a .fa-youtube{
    color: #f70900!important;
}
.social-icons li a:hover .fa-youtube{
    color: white!important;
}
.social-icons li:hover.social-icons-youtube a {
    background: #f70900 !important;
}

.testimonial blockquote {
    padding: 2.5rem 4rem 1rem 4.5rem;
}

@media (max-width: 991px) {
    #header .header-nav-main nav > ul li a {
        font-size: 16px;
    }
}

input[type=range]{
    -webkit-appearance: none;
    border: none;
    width: 65%;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 50%;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: goldenrod;
    margin-top: -4px;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #ccc;
}

html .toggle-primary .toggle.active > label, html .toggle-primary .toggle.active > .toggle-title {
    background-color: #a16b00;
}
.post-image img{
    max-height: 180px;
}
@media (max-width: 767px) {
    .post-image img{
        max-height: 100%;
    }
}


h2{
    font-size: 2.2rem;
    margin-bottom: 0;
}

h3{
    font-size: 2rem;
    margin-bottom: 0;
}

h4{
    font-size: 1.5rem;
    margin-bottom: 0;
}

h5{
    font-size: 1.2rem;
    margin-bottom: 0;
}

.p-static h2{
    color: white
}
.toggle > label, .toggle > .toggle-title{
    color: #A16B01;
    border-left-color: #A16B01;
    border-right-color: #A16B01;
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-right: solid 1px;
    background-color: #fff;
}
.toggle.active > label, .toggle.active > .toggle-title{
    background-color: #eee;
}

.toggle > label:hover, .toggle > .toggle-title:hover {
    background: #eee;
}

html .toggle-primary .toggle.active > label, html .toggle-primary .toggle.active > .toggle-title {
    background-color: #d08a00;
}

html .toggle-primary .toggle.active > label, html .toggle-primary .toggle.active > .toggle-title {
    background-color: #fff;
    border-color: #d08a00;
    color: #a16b00;
}

a:not(.btn):hover {
    text-decoration: none;
}

.nav-tabs li .nav-link {
    font-size: 1rem;
}
.list.list-icons.list-icons-style-2 li > [class*="fa-"]:first-child, .list.list-icons.list-icons-style-2 li > .icons:first-child, .list.list-icons.list-icons-style-2 li a:first-child > [class*="fa-"]:first-child, .list.list-icons.list-icons-style-2 li a:first-child > .icons:first-child {
    width: 28px;
    height: 28px;
}

#header .header-nav-main-effect-1 nav > ul > li.dropdown:hover > .dropdown-menu, #header .header-nav-main-effect-1 nav > ul > li.dropdown.open > .dropdown-menu, #header .header-nav-main-effect-1 nav > ul > li.dropdown.accessibility-open > .dropdown-menu {
    background-color: #fafafa;
}

.full-screen, .mobileoff-fullscreen-top-space, .fullscreenabanner { height: 980px; }
.swiper-container { width: 100%; height: 100%; }

.full-screen, .mobileoff-fullscreen-top-space, .fullscreenabanner {
    height: 980px;
}

.swiper-container {
    width: 100%;
    height: 100%;
}
.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
}

.white-move .swiper-slide, .white-move .swiper-wrapper { cursor: url("../images/icon-move-light.png"), move; }
.black-move .swiper-slide, .black-move .swiper-wrapper { cursor: url("../images/icon-move-black.png"), move; }

.vertical-white-move .swiper-slide, .vertical-white-move .swiper-wrapper { cursor: url("../images/vertical-icon-move-light.png"), move; }
.vertical-black-move .swiper-slide, .vertical-black-move .swiper-wrapper { cursor: url("../images/vertical-icon-move-black.png"), move; }

.swiper-pagination-medium .swiper-pagination-bullet{ width: 10px; height: 10px; }
.swiper-pagination-medium .swiper-pagination-bullet-active{ width: 16px; height: 16px; }
.swiper-pagination-big .swiper-pagination-bullet { width: 14px; height: 14px; }
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 6px; }
.slider-custom-image > .swiper-button-next, .slider-custom-image > .swiper-button-prev  { bottom: 0; top: inherit; left: inherit }

/* swiper vertical pagination */
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 10px 0}

/* swiper pagination bottom */
.swiper-pagination-bottom .swiper-wrapper { margin-bottom: 65px; }
.swiper-pagination-bottom.small-bottom .swiper-wrapper { margin-bottom: 50px; }
.swiper-pagination-bottom > .swiper-pagination-bullets { bottom: 0; }
.swiper-pagination-bottom > .swiper-button-next, .swiper-pagination-bottom > .swiper-button-prev  { bottom: 0; top: inherit; left: inherit }

/* swiper pagination light */
.swiper-light-pagination .swiper-pagination-bullet { border: 2px solid #fff; opacity: 0.5; }
.swiper-light-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; opacity: 1; }
.swiper-pagination-medium.swiper-light-pagination .swiper-pagination-bullet { border: 2px solid #fff; background-color: #fff; opacity: 1; }
.swiper-pagination-medium.swiper-light-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { border-color: #fff; background-color: transparent; }

/* dot pagination dark */
.swiper-pagination-dot .swiper-pagination-bullet { background:#000; border-color: #000; opacity: 0.4; }
.swiper-pagination-dot .swiper-pagination-bullet-active { background:#000; border-color: #000; opacity: 1; }

/* dot pagination light */
.swiper-pagination-dot.swiper-light-pagination .swiper-pagination-bullet { background:#fff; border-color: #fff; opacity: 0.5; }
.swiper-pagination-dot.swiper-light-pagination .swiper-pagination-bullet-active { background:#fff; border-color: #fff; opacity: 1; }

/* square pagination */
.swiper-pagination-square .swiper-pagination-bullet { height:3px; width:30px; border-radius: 0;opacity: 0.3; cursor: pointer; }
.swiper-pagination-square .swiper-pagination-bullet-active { opacity: 1; }

/* slider navigation */
.swiper-next.swiper-button-disabled, .swiper-prev.swiper-button-disabled { opacity: 0.6; }
.swiper-button-next, .swiper-button-prev { height: 40px; width: 40px; line-height: 40px; margin: 0; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -ms-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; outline: none; }
.swiper-button-next.large, .swiper-button-prev.large { height: 62px; width: 62px; line-height: 62px; font-size: 18px; }
.swiper-button-next:after, .swiper-button-prev:after { display: none; }
.swiper-button-next:hover, .swiper-button-prev:hover { -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -ms-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; }

.swiper-button-next { right: 0; }
.swiper-button-prev { left: 0; }

.cover-background { background-repeat: no-repeat !important; background-size: cover !important; overflow: hidden; position: relative; background-position: center center !important; }

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.slider-navigation-style-07.swiper-button-next, .slider-navigation-style-07.swiper-button-prev { background-color: rgba(23,23,23,.5); color: #fff; }
.slider-navigation-style-07.swiper-button-next:hover, .slider-navigation-style-07.swiper-button-prev:hover { background-color: #fff; color: #232323; }
.slider-navigation-style-07.swiper-button-next.light, .slider-navigation-style-07.swiper-button-prev.light { background-color: #fff; color: #232323; }
.slider-navigation-style-07.swiper-button-next.light:hover, .slider-navigation-style-07.swiper-button-prev.light:hover { background-color: #232323; color: #fff; }
.slider-navigation-style-07.swiper-button-next.light { right: -70px;}
.slider-navigation-style-07.swiper-button-prev.light { left: -70px;}
.slider-navigation-style-07.swiper-button-next { right: 40px;}
.slider-navigation-style-07.swiper-button-prev { left: 40px;}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}


/*!* Slick Slider *!
header {
    overflow: hidden;
}

.hero-text h2 {
    margin-bottom: 50px;
}

.hero-text .hero {
    position: relative;
}

.hero-text .hero .hero-slide a:hover span {
    color: #033a71;
}

.hero .hero-slide img {
    width: 100%;
    height: 600px;
    object-fit: cover;
    object-position: top center;
}

.hero .hero-slide .header-content {
    top: 20%;
    margin-left: 8rem;
    max-width: 550px;
    width: 100%;
    padding: 2rem;
}

.slide-content {
    padding: 10px 20px 10px 0;
}

.slide-content .h1 {
    font-size: 62px;
}

.btn-primary {
    background-color: #5302FE;
    border-radius: 0;
}

.slick-dots {
    position: absolute;
    bottom: 10px;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    border-radius: 50%;
    border: 0;
    outline: none;
}

.slick-dots li button::before {
    font-size: 18px;
    color: #fff;
    opacity: 1;
}

.slick-active button {
    background: #d60e96;
}*/

/** Text Animation **/

@-webkit-keyframes fadeInUpSD {
    0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInUpSD {
    0% {
        opacity: 0;
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
}

.slick-active .slide-content {
    animation-name: fadeInUpSD;
    animation-duration: 1s;
    opacity: 1;
    width: 100%;
    padding: 10px 20px 30px 0;
}

/* Media Queries */

@media (max-width: 768px) {
    .hero-text .hero .hero-slide a {
        padding-top: 0.8rem;
    }

    .hero-text .hero .hero-slide a span {
        font-size: 20px;
        margin-top: 0.5rem;
    }

    .hero .hero-slide .header-content {
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        margin: 0 auto;
    }
}

.text-white{
    color: white;
}

/*email protect*/
.cry_em:after {
    content: attr(data-name) "@" attr(data-domain) "." attr(data-tld);
}

.mfp-title {
    text-align: center;
    font-size: 24px;
    margin-top: 10px;
}

#header .header-body {
    border-top: 1px solid white;
}

.product .product-thumb-info {
    background: white;
}

#header .header-nav-main nav > ul > li > a {
    text-transform: none;
}

h1, h2, h3, h4, h5, h6 {
    text-transform: none;
}

::placeholder {
    color: #c9c9c9 !important;
    font-size: 1em;
    font-weight: 300;
}

.show_img img{border: solid 3px #eee;opacity: 0.5}
.show_img img.active{border: solid 3px #999;opacity: 1}

#footer {
    border-top: none;
}

iframe {
    margin: 0;
    padding: 0;
    border: 0;
    display: block;
}


/*首頁最下方手機版5按鈕*/
.phone_link {
    display: none;
}
@media (max-width: 1024px) {
    .phone_link {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 75px;
        background-color: #aa834b;
        border-top: 1px solid white;
        z-index: 99;
    }
    .phone_link .item_div {
        display: flex;
        flex-wrap: nowrap;
    }
    .phone_link .item_div .phone_item {
        height: 75px;
        flex-grow: 1;
        text-align: center;
        padding: 10px 0 0;
        border-left: 1px solid white;
    }
    .phone_link .item_div .phone_item:first-child {
        border-left: 1px solid transparent;
    }
    a {
        color: #242424;
        cursor: pointer;
        transition: all 0.4s ease;
    }
    .phone_link .item_div .phone_item .title {
        color: #fff;
        font-size: 15px;
        line-height: 15px;
        letter-spacing: 1px;
        font-weight: 500;
    }
    .phone_link .item_div .phone_item img {
        width: 32px;
        height: 32px;
        padding-top: 5px;
    }
    .phone_link .item_div p{
        margin-top: 0;
    }
    .item_div span{
        color: white;
        font-size: 2em;
    }
    .item_div a{
        background-color: var(--primary-color-1);
    }
    .item_div a:hover{
        background-color: grey;
    }
}

html .scroll-to-top {
    bottom: 150px;
}

article.post-large .post-image, article.post-large .post-date {
    margin-left: 0;
}
