@charset "utf-8";
/* CSS Document */
.bg-plantfinity {background: #afafaf url("../img/banner/bg002.jpg") no-repeat;background-attachment: fixed}
    .slider__items--inner {
        padding-top: 25%;
    }
.bg-color__plantfinity {background-color: #fdf5f5 }
.contact__section {background-color: #F0F0F0}
.form-check-input {
   
    margin-top: 20px;
    vertical-align: middle;
}
.pro_img_center {display: block;margin:0 auto 20px auto;max-width: 400px}
.shadowBG {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}
.shadowBG {
    -webkit-box-shadow: inherit !important;
    box-shadow: inherit !important;
}
.shadowBG.dark-hard {
    position: relative;
    z-index: 1;
}
.shadowBG.dark-hard:after {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
    -webkit-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}
.shadowBG.dark-hard::after {
   display: block
}
.shadowBG.dark-hard.colorful:after {
 
    background:#000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.5;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
    -webkit-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}
.banner-style-ten-area {
    padding-top: 220px;
    padding-bottom: 150px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.banner-style-ten-area video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
}
.banner-style-ten-area.smallpadding {
    padding-top: 100px;
    padding-bottom: 100px;
   
}

.header__account--items {display: block}
.hero__slider--sectionA{position: relative}
.upload-section {padding:30px 40px;background-color:#E9E8E8;position: relative}
.upload-section h4 {font-size: 2.6rem;font-weight: 500}
.ssi-imgToUpload {
    max-width: 150px;
    height: auto;
}
.ssi-imgToUploadTable tr td {
    width: auto;
}
.pro_img {}
.pro_img img {display: block;margin: 0 0 20px 0}
.grid__banner--title {font-size: 6rem;text-transform: uppercase}
.item-intra {padding:10px 10px 50px 10px;margin-bottom: 10px;text-align: center;background-color: #fff;box-shadow: 0px 0px 5px rgba(0,0,0,.3);margin-top: 30px}
.item-intra img {padding:0px 10px;margin-bottom: 20px;overflow: hidden;border-radius: 5px}
.item-intra  h4 {color: #5C4D2D;font-size: 2rem;line-height: 2.6rem;margin-bottom: 25px}
.item-intra  h5 {color: #1B1B1B;font-size: 1.45rem;line-height: 2rem;padding:10px 1px 50px 1px}
.blog__card {position: relative}
.stepicon {width: 100px;height: 100px;text-align: center;font-size:24px;padding-top:22px;background-color: #AC4435;color: #fff;border-radius: 50% }
.stepicon span {font-size:40px;display: block;margin-top: 5px;font-weight: 600}
.face__step--title {
   margin-bottom: 30px;
    color: #d5855d;
}
.face__step {
    margin-bottom: 4.5rem;
    padding-bottom: 4.5rem;
}
.accordion__items--body {
    
    padding: 20px;
}
.hero__word {position: absolute;z-index: 4;top:0;left: 0;width: 100%;height: auto}
.home__two--slider__items {
    position: relative;}
/*連動*/
.main-wrapper {
            position: relative;
            width: 100%;
            /* height: 100vh; 全螢幕高度 */
            display: flex;
            justify-content: center;
            align-items: center;
            overflow: hidden;
    padding:50px 0
        }

        /* 2. 按鈕分散定位與樣式 */
        .custom-btn {
            position: absolute;
            padding: 15px 30px;
            z-index: 50;
            cursor: pointer;
            border: none;
            background: #ffffff;
            color: #333;
            font-size: 16px;
            font-weight: 600;
            border-radius: 50px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

        /* 分散位置定義 */
        .pos-1 { top: 10%; left: 10%; }
        .pos-2 { bottom: 20%; right: 5%;  }
        .pos-3 { bottom: 10%; left: 15%; }
.pos-4 { bottom: 40%; left: 10%; }
.pos-5 { top: 30%; right: 15%; }

        /* Hover 效果 */
        .custom-btn:hover {
            transform: translateY(-8px); /* 向上浮起 */
            box-shadow: 0 12px 24px rgba(0,0,0,0.2);
            color: #007AFF;
        }

        /* Active 選中狀態與呼吸燈動畫 */
        .custom-btn.active {
            background: #333;
            color: #fff;
            box-shadow: 0 0 0 4px rgba(0, 122, 255, 0.3);
            animation: pulse 2s infinite;
        }

        @keyframes pulse {
            0% { transform: scale(1); }
            50% { transform: scale(1.05); }
            100% { transform: scale(1); }
        }

        /* 3. 內容顯示區塊 */
        .display-container {
            width: 800px;
            height: 500px;
            position: relative;
        }

        .content-block {
            position: absolute;
            top: 0; left: 0;
            width: 100%;
            height: 100%;
            display: none; /* 初始隱藏 */
        }

        .content-block.active {
            display: block;
        }

        /* 圖片淡入 */
        .img-box img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 20px;
            box-shadow: 0 20px 40px rgba(0,0,0,0.15);
        }

        /* 4. 文字位移效果 (由下而上) */
        .text-box {
            position: absolute;
            bottom: -30px;
            left: 40px;
            background: rgba(255, 255, 255, 0.9);
            padding: 25px;
            border-radius: 15px;
            max-width: 300px;
            opacity: 0;
            transform: translateY(50px);
            transition: all 0.8s ease-out;
            backdrop-filter: blur(5px);
        }

        .content-block.active .text-box {
            opacity: 1;
            transform: translateY(-60px); /* 向上浮現到定位 */
        }

        .text-box h2 { margin: 0 0 10px; color: #1d1d1f; }
        .text-box p { margin: 0; color: #666; line-height: 1.6;font-size: 1.4rem }
/*連動*/
/*blog*/
.blog__card { padding: 20px;}
.blog__details--content__desc {white-space: pre-line;line-height: 26px}

/*blog*/
.section__heading h2 {font-size: 2rem}
.privacy__policy--content {}
.privacy__policy--content ul {}
.privacy__policy--content ul li {display: block;padding:10px 0;margin-bottom: 15px;line-height: 20px;font-size: 15px}
.hero__slider--section {background-color: #000;}
.header__sub--menu__link {
    font-size: 1.5rem;
    display: block;
    line-height: 1.6rem;
    padding: 10px 0;
    font-weight: 500;
    color: var(--primary-color);
}
.header__menu--link_level {
    font-size: 1.5rem;
    display: block;
    line-height: 1.6rem;
    padding: 10px 0;
    font-weight: 500;
    color: var(--primary-color);
}
.current__price {
    font-family:var( --Lato-fonts);
    
}
.current__price span {
    font-family:var( --Lato-fonts);
    color: var(--hover-color);
    font-weight: 400;
    line-height: 3rem;
    font-size: 3rem;
    display: inline-block;
    margin-left: 8px;
    
}
.account__content--title {
    font-weight: 600;
    font-size: 2rem;
    line-height: 2.8rem;
    color: var(--primary-color);
    border-bottom: 1px dashed #000;
    padding-bottom: 20px;
}
.product__details--info__price .old__price {
    font-size: 1.4rem;
    margin-left: 0rem;
    display: block;
    font-family:var( --Lato-fonts);
}
.product__details--info__title {
    font-size: 2.6rem;
    line-height: 3rem;
    color: var(--primary-color);
}
.product__details--info__title.eng {
    font-size: 1.5rem;
    line-height: 3rem;
    color: var(--primary-color);
    color:#656565
}
    .product__details--info {
       padding-top: 20px;
    }
.product__details--media {
  
    padding:0 20px 20px;
}
.pro-material {padding:20px;background-color: #D46E63;font-size: 1.4rem;color:#fff;margin: 10px 0;white-space: pre-line}
.product__tab--conten {padding:25px 0}
.product__tab--content img {max-width: 1200px;display: block;margin: 0 auto;width: 100%}
.pro_Return {white-space: pre-line;font-size: 1.6rem; }
.pro_Return span {color: #AF4F35;font-size: 2.1rem;font-weight: 500 }
input.quantity__number {
    
    width: 6rem;
    
}
.membertravel-box {padding:0 15px}
.membertravel-box .btn {font-size: 1.6rem}
details {
  border: 0px solid #aaaaaa;
  border-radius: 4px;
  padding: 0.5em 0.5em 0; background-color: #efdcdc;
    display: block;padding:10px 5px
   
}

summary {
    text-align: left;
  font-weight: bold;
  margin: -0.5em -0.5em 0;
  padding: 0.5em;
   
}
.section_diff {padding:10px 50px}
@media only screen and (min-width: 992px) {
    .product__details--info__title {
        font-size: 3.6rem;
        margin: 10px 0 20px 0;
    }
    .product__details--info__title.eng {
    font-size: 2.5rem;
    
}
}
.btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 1rem 4rem;
    font-size: 2rem;
    border-radius: .25rem;
    transition: color .15s 
ease-in-out, background-color .15s 
ease-in-out, border-color .15s 
ease-in-out, box-shadow .15s 
ease-in-out;
}
.btn-block {width: 100%}
.btn-outline-danger {color: red;
    background-color: transparent;
    border-color: red;}
.btn-outline-danger:hover {color: white;
    background-color: red;
    border-color: red;}
.btn-dark {
    color: #fff;
    background-color: #212529;
    border-color: #212529;
}
 .btn-dark:hover {
    color: #fff;
    background-color: #646464;
    border-color: #212529;
} 
.btn-danger {
  color: #fff !important;
  background-color: #dc3545;
  border-color: #dc3545
}
.btn-danger:hover {
  color: #fff;
  background-color: #bb2d3b;
  border-color: #b02a37
}
.btn-outline-dark {
    color: #212529;
    background-color: none;
    border-color: #212529;
}
.btn-outline-dark:hover {
    color: #fff;
    background-color: #212529;
    border-color: #212529;
}
.btn-outline-primary {
  color: #0d6efd;
  border-color: #0d6efd
}
.btn-outline-primary:hover {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd
}
.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .5)
}
.btn-check:active + .btn-outline-primary, .btn-check:checked + .btn-outline-primary, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary:active {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd
}
.btn-check:active + .btn-outline-primary:focus, .btn-check:checked + .btn-outline-primary:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus, .btn-outline-primary:active:focus {
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .5)
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color: #0d6efd;
  background-color: transparent
}
.btn-outline-secondary {
  color: #6c757d;
  border-color: #6c757d
}
.btn-outline-secondary:hover {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d
}
.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {
  box-shadow: 0 0 0 .25rem rgba(108, 117, 125, .5)
}
.btn-check:active + .btn-outline-secondary, .btn-check:checked + .btn-outline-secondary, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show, .btn-outline-secondary:active {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d
}
.btn-check:active + .btn-outline-secondary:focus, .btn-check:checked + .btn-outline-secondary:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus, .btn-outline-secondary:active:focus {
  box-shadow: 0 0 0 .25rem rgba(108, 117, 125, .5)
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
  color: #6c757d;
  background-color: transparent
}
.btn-outline-success {
  color: #198754;
  border-color: #198754
}
.btn-outline-success:hover {
  color: #fff;
  background-color: #198754;
  border-color: #198754
}
.btn-check:focus + .btn-outline-success, .btn-outline-success:focus {
  box-shadow: 0 0 0 .25rem rgba(25, 135, 84, .5)
}
.btn-check:active + .btn-outline-success, .btn-check:checked + .btn-outline-success, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show, .btn-outline-success:active {
  color: #fff;
  background-color: #198754;
  border-color: #198754
}
.btn-check:active + .btn-outline-success:focus, .btn-check:checked + .btn-outline-success:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus, .btn-outline-success:active:focus {
  box-shadow: 0 0 0 .25rem rgba(25, 135, 84, .5)
}
.btn-outline-success.disabled, .btn-outline-success:disabled {
  color: #198754;
  background-color: transparent
}
.btn-outline-info {
  color: #0dcaf0;
  border-color: #0dcaf0
}
.btn-outline-info:hover {
  color: #fff;
  background-color: #0dcaf0;
  border-color: #0dcaf0
}
.btn-info {
  color: #fff;
  background-color: #0dcaf0;
  border-color: #0dcaf0
}
.btn-info:hover {
  color: #fff;
  background-color: #31d2f2;
  border-color: #25cff2
}
.btn-check:focus + .btn-outline-info, .btn-outline-info:focus {
  box-shadow: 0 0 0 .25rem rgba(13, 202, 240, .5)
}
.btn-check:active + .btn-outline-info, .btn-check:checked + .btn-outline-info, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show, .btn-outline-info:active {
  color: #fff;
  background-color: #0dcaf0;
  border-color: #0dcaf0
}
.btn-check:active + .btn-outline-info:focus, .btn-check:checked + .btn-outline-info:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus, .btn-outline-info:active:focus {
  box-shadow: 0 0 0 .25rem rgba(13, 202, 240, .5)
}
.btn-outline-info.disabled, .btn-outline-info:disabled {
  color: #0dcaf0;
  background-color: transparent
}
.btn-outline-warning {
  color: #ffc107;
  border-color: #ffc107
}
.btn-outline-warning:hover {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107
}
.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {
  box-shadow: 0 0 0 .25rem rgba(255, 193, 7, .5)
}
.btn-check:active + .btn-outline-warning, .btn-check:checked + .btn-outline-warning, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show, .btn-outline-warning:active {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107
}
.btn-check:active + .btn-outline-warning:focus, .btn-check:checked + .btn-outline-warning:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus, .btn-outline-warning:active:focus {
  box-shadow: 0 0 0 .25rem rgba(255, 193, 7, .5)
}
.btn-outline-warning.disabled, .btn-outline-warning:disabled {
  color: #ffc107;
  background-color: transparent
}
.btn-outline-danger {
  color: #dc3545;
  border-color: #dc3545
}
.btn-outline-danger:hover {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545
}
.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {
  box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .5)
}
.btn-check:active + .btn-outline-danger, .btn-check:checked + .btn-outline-danger, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show, .btn-outline-danger:active {
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545
}
.btn-check:active + .btn-outline-danger:focus, .btn-check:checked + .btn-outline-danger:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus, .btn-outline-danger:active:focus {
  box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .5)
}
.btn-outline-danger.disabled, .btn-outline-danger:disabled {
  color: #dc3545;
  background-color: transparent
}
.btn-outline-light {
  color: #f8f9fa;
  border-color: #f8f9fa
}
.btn-outline-light:hover {
  color: #000;
  background-color: #f8f9fa;
  border-color: #f8f9fa
}
.btn-check:focus + .btn-outline-light, .btn-outline-light:focus {
  box-shadow: 0 0 0 .25rem rgba(248, 249, 250, .5)
}
.btn-check:active + .btn-outline-light, .btn-check:checked + .btn-outline-light, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show, .btn-outline-light:active {
  color: #000;
  background-color: #f8f9fa;
  border-color: #f8f9fa
}
.btn-check:active + .btn-outline-light:focus, .btn-check:checked + .btn-outline-light:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus, .btn-outline-light:active:focus {
  box-shadow: 0 0 0 .25rem rgba(248, 249, 250, .5)
}
.btn-outline-light.disabled, .btn-outline-light:disabled {
  color: #f8f9fa;
  background-color: transparent
}
.btn-outline-dark {
  color: #212529;
  border-color: #212529
}
.btn-outline-dark:hover {
  color: #fff;
  background-color: #212529;
  border-color: #212529
}
.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {
  box-shadow: 0 0 0 .25rem rgba(33, 37, 41, .5)
}
.btn-check:active + .btn-outline-dark, .btn-check:checked + .btn-outline-dark, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show, .btn-outline-dark:active {
  color: #fff;
  background-color: #212529;
  border-color: #212529
}
.btn-check:active + .btn-outline-dark:focus, .btn-check:checked + .btn-outline-dark:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus, .btn-outline-dark:active:focus {
  box-shadow: 0 0 0 .25rem rgba(33, 37, 41, .5)
}
.btn-outline-dark.disabled, .btn-outline-dark:disabled {
  color: #212529;
  background-color: transparent
}
.fraBanner_section {padding:150px 0 200px 0;background-color: #000}
.fraBanner_section_step {padding:90px 0 200px 0;background: #fde9e9 url("../img/banner/fra_bg.jpg"); background-repeat: repeat-x; }
.fraBanner_section_stepColor {background-color: #b66b58;margin-bottom: 100px}
.fra_title {font-size: 2rem;line-height: 3rem;font-weight: 500;margin-bottom: 30px;text-align: center}
.variant__color--list  input[type=radio] + label{
    border: 0px solid #000000;
    background-color: transparent;
    opacity: 1;
     -webkit-transition: var(--transition);
  transition: var(--transition);
}
.variant__color--list  input[type=radio]:hover + label{
    border: 0px solid #000000;
    background-color: #e5beb5;
    opacity: 1;
}
.variant__color--list  input[type=radio]:checked + label{
    border: 0px solid #000;
    background-color: #e5beb5;
    opacity: 1;
}
.variant__color--list  input[type=radio] + label .variant__color--value__img{
    
    opacity: 1;
    background-color: #000;
     -webkit-transition: var(--transition);
  transition: var(--transition);
}
.variant__color--list  input[type=radio]:hover + label .variant__color--value__img{
    
    background-color: transparent;
    opacity: 1;
}
.variant__color--list  input[type=radio]:checked + label .variant__color--value__img{
    
    background-color: transparent;
    opacity: 1;
}
.variant__color--list  input[type=radio] + label .variant__color--value__img img{
    
    opacity: .5;
    
     -webkit-transition: var(--transition);
  transition: var(--transition);
}
.variant__color--list  input[type=radio]:hover + label .variant__color--value__img img{
    
    
    opacity: 1;
}
.variant__color--list  input[type=radio]:checked + label .variant__color--value__img img{
    
    opacity: 1;
}
.stepname {padding:20px 10px;
    color:#fff;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
font-size: 1.8rem}
.stepname.active {background-color: #741A1C}
.stepname span {
    border-radius: 5px;
    color: #b66b58;
    font-size: 1.6rem;
    height: 2rem;
    margin: 0 .625rem 0 0;
    /* vertical-align: middle; */
    width: 2rem;
    text-align: center;
    line-height: 2.3rem;
    background-color: #fff;
    font-weight: 600;
}
.variant__color--list {
    margin-right: 0px;
    margin-bottom: 20px;
    width: 24%;display: inline-block;
}
.variant__color--value {
    width: 100%;
    height: auto;
    padding: 10px;
    
    display: block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 10px;
    margin-right: 15px;
    line-height: 1;
    cursor: pointer;
}
.variant__color--value__img {border-radius: 10px;overflow: hidden}

.fra_choose {padding:10px}
.fra_choose_img {overflow: hidden;border-radius: 10px}
.fra_choose_des {
    font-size: 1.6rem;
    padding: 20px 10px;
    text-align: center;
    line-height: 2.5rem;
    color: #454545;
}
.slideimg a {display: inherit}
.text-shadow {text-shadow: 0 0 7px rgba(0,0,0,.8)}
.fra_choose_des span {font-size: 1.8rem;font-weight: 600;display: block;margin-bottom: 20px}
.hero__slider--items { background: url("../img/slider/home-01B.jpg");height: 100vh}
.hero__slider--items.second { background: url("../img/slider/home-02.jpg");height: 100vh}
.home_section {padding:220px 0;background: url("../img/slider/section_2.jpg") no-repeat center}
.slider__desc.goodlogo img {display: block;width: 220px;margin: 0 auto 20px auto}
.slider__desc.home-dis {font-size: 4.3rem;text-shadow: 0 0 7px rgba(0,0,0,.8);line-height: 5rem}
.slider__maintitle.home-dis {font-size: 6.5rem;text-shadow: 0 0 7px rgba(0,0,0,.8);color:#fff;font-weight: 600}
.home_section.about {padding:200px 0;background: url("../img/banner/about01.jpg") no-repeat center;background-size: cover}
.home_section.about_3 {padding:150px 0;background:#faf0f0 url("../img/banner/about03A.jpg") no-repeat center;background-size: cover;background-attachment: fixed }
.home_section.about_4 {padding:200px 0;background:#f7e0d7 url("../img/banner/about03.jpg") no-repeat center;background-size: cover;background-attachment: fixed}
.home_section.about_5 {padding:250px 0;background:#faf0f0 url("../img/banner/about02A.jpg") no-repeat center;background-size: cover;position: relative}
.about_7 {padding:150px 0;background:#faf0f0;}
.cooper_title {display: block;margin:20px 0 100px 0}
.home_section_3 {padding:250px 0;background: url("../img/slider/section_3.jpg") no-repeat center}
.home_section_3 .slider__desc {}
.section_padding-3 {padding:100px}
.section_pink {background-color:#f7e0d7 }
.home_section.about_6 {padding:200px 0;background:#f7e0d7 url("../img/banner/about02A.jpg") no-repeat center right;position: relative}
.section_left {background:#f7e0d7 url("../img/banner/about02A.jpg") no-repeat center bottom;background-size: cover;position: relative;min-height: 800px}
.home_section.cooper_1 {padding:200px 0;background:#f7e0d7 url("../img/banner/cooper001.jpg") no-repeat center top;background-size: cover;position: relative}
.product_3 {padding:200px 0;background:#f7e0d7 url("../img/banner/pr002.jpg") no-repeat center top;background-size: cover;position: relative}
.product_4 {padding:200px 0;position: relative}
.contact_banner {padding:100px 0;background:#f7e0d7 url("../img/banner/contact.jpg") no-repeat center;background-size: cover;position: relative}
.area_box {padding:20px 20px;border-radius: 15px;background-color: rgba(255,255,255,0.5);margin-bottom: 30px}
.area_slider_padding {padding:5px 20px}
.area_des {margin-bottom: 5px;padding:10px}
.area_des ul {align-items: center}
.area_des ul li {padding:4px 0;display: block;color:rgba(51,51,51,1.00);font-size: 1.6rem;font-weight: 500;line-height: 5rem}
.area_des ul li i {font-size: 3rem;display: inline-block;margin-right: 8px}
.area_icon {display: inline-block}
.area_des_icon  i {font-size: 9rem;color:rgba(30,172,37,1.00)}
.area_des_icon.FB  i {font-size: 9rem;color:rgba(10,100,183,1.00)}
.area_des_icon  i:hover {color:#535353}

/**/
.word_line {
  position: relative; /* 設置相對定位，方便控制偽元素位置 */
  padding-bottom: 20px; /* 讓底線與文字之間保持一定距離 */
}

.word_line::after {
    content: "";
  position: absolute;
  left: 50%; /* 從中央開始 */
  bottom: 0;
  transform: translateX(-50%); /* 將底線居中對齊 */
  width: 60px; /* 固定底線的寬度 */
  height: 3px;
  background-color: #795609;

}
/**/


.section_word {padding:50px 90px;border:3px solid #af8c7e;align-items:center}
.img_center img{display: block;margin:0 auto 30px auto;max-width: 200px}
.home_section_4 {padding:200px 0;background: url("../img/slider/section_4.jpg") no-repeat center}
.home_section_5 {padding:200px 0;background: url("../img/slider/SS002.jpg") no-repeat center}
.product_move {display: block;position: absolute;bottom:10%;left:-8%;max-width: 400px;z-index: 1}
.product_move img{width: 100%}
.slider__content .title {font-size: 6.5rem;color:#fff;line-height: 70px;font-weight: 500}
.slider__content .title-2 {font-size: 5rem;color:#fff;line-height: 30px;font-weight: 500}
.cooper_2 {padding:200px 0;background:#f7e0d7 url("../img/banner/cooper002.jpg") no-repeat center;background-size: cover;}
.cooper_3 {padding:200px 0;background:#f7e0d7;}
.cooper_4 {padding:150px 0;background:url("../img/slider/section_4A.jpg") no-repeat center;background-size: cover;}
.cooper_area {overflow: hidden;
    border-radius: 10px;
    padding: 5px;
    margin-bottom: 40px;
    position: relative;
    background-color: #ffffffc2;
    box-shadow: 0 0 15px rgba(0, 0, 0, .2);}
.cooper_img {border-radius: 10px 10px 0 0;overflow: hidden}
.cooper_desc {padding:20px}
.cooper_desc i {display: block;margin-bottom: 20px;text-align: center;font-size: 7rem;color: #795609 }
.cooper_desc ul {}
.cooper_desc ul li {padding:10px;display: block;margin-bottom: 20px;font-size: 1.6rem;color: #2B2B2B;line-height: 2rem}
.cooper_desc ul li span {font-size: 1.6rem;color: #2B2B2B;font-weight: 600}
.cooper_who {display: block;width: 100%;padding:10px;border-radius: 8px;background-color: rgba(255,255,255,.7);margin-bottom: 20px;}
.cooper_who-img {border-radius: 50%;width: 110px;height: 110px;overflow: hidden;margin:0 auto}

.cooper_who-title {font-size:1.6rem;color:#454545;text-align: left}
.cooper_who-title span {font-size:1.8rem;font-weight: 600;color:#232323;display: block;margin-bottom: 20px;margin-top: 20px}
.cooper_block {padding:30px;background-color: #e7c7ba;border-radius: 25px}
.product_6 {padding:150px 0;background:url("../img/banner/pr001.jpg") no-repeat center;background-size: cover;}
.product_7 {padding:100px 0 150px 0;background:#000}
.product_8 {padding:150px 0;background:#f5d9d9}
.product__box {padding:20px;background-color: #fff;border-radius: 30px;margin-bottom: 30px;overflow: hidden}
.product_des {}
.product_des ul {}
.product_des ul li {display: block;padding: 10px 0;margin-bottom: 10px}
.section_pro {padding:150px 0;background-color: #f5d9d9}
.product_funtion {}
.product_funtion ul {padding:50px 0}
.product_funtion ul li {display: block;margin-bottom: 10px;padding:8px; font-size: 1.4rem;background-color: rgba(255,255,255,0.70);border:1px solid #fff;border-radius: 30px;line-height: 18px;width: auto}
.product_funtion ul li span {display: inline-block;height: 20px;width: 20px;border-radius: 50%;background-color: rgba(191,94,96,1.00);font-weight: 600;text-align: center;color: #fff;margin-right: 10px}
.product_funtion ul li bold {display: inline-block;
    border-radius: 45px;
    background-color: #8d7646;
    font-weight: 600;
    text-align: center;
    color: #fff;
    margin-right: 10px;
    padding:6px 10px;}
.product_funtionA {}
.product_funtionA ul {padding:50px 0}
.product_funtionA ul li {display: block;margin-bottom: 10px;padding:8px; font-size: 1.4rem;background-color:rgb(255 223 214 / 69%);border-radius: 30px;line-height: 18px;width: auto}
.product_funtionA ul li span {display: inline-block;height: 20px;width: 20px;border-radius: 50%;background-color: rgba(191,94,96,1.00);font-weight: 600;text-align: center;color: #fff;margin-right: 10px}
.product_funtionA ul li bold {display: inline-block;
    border-radius: 45px;
    background-color: #8d7646;
    font-weight: 600;
    text-align: center;
    color: #fff;
    margin-right: 10px;
    padding:6px 10px;}
.product_funtion_2 {padding:20px 30px;border-radius: 20px;background-color: #fff;text-align: center;font-size: 1.4rem}
.product_funtion_2 span {display: block;margin-bottom: 20px;font-size: 1.8rem;font-weight: 600;color:#795609}
.product_funtion_2 img {width: 120px;display: block;margin: 10px auto 30px auto}
.product_funtion_iconfirst {border-radius: 50px;padding:5px;border:1px solid #fff;margin: 10px 0 20px 0;min-height: 317px} 
.product_funtion_icon {border-radius: 45px;
    padding: 20px 20px 30px 20px;
    background-color: rgba(255, 255, 255, 0.27);
    display: block;
    color: #fff;
    font-weight: 600;
    text-align: center;
    font-size: 2.4rem;
    box-shadow: inset 0px 0px 18px 5px rgba(255, 255, 255, .4);
text-shadow: 0 0 5px rgba(0,0,0,.3);min-height: 305px}
.product_funtion_icon img {display: block;
    max-width: 150px;
    margin: 10px auto 20px auto;
    border-bottom: 3px solid #fff;
    padding-bottom: 20px;}
.backdrop-blur {
  backdrop-filter: blur(5px);
}
.shadow {
    -webkit-box-shadow: inherit !important;
    box-shadow: inherit !important;
}
.banner-style-ten-area video {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    object-fit: cover;
}
.banner-style-ten-area {
    padding-top: 220px;
    padding-bottom: 150px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.shadow.dark-hard {
    position: relative;
    z-index: 1;
}
.bg-dark .banner-style-ten-area video {
    display: block;
}
.shadow.dark-hard:after {
    background: var(--bg-black-color) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
    -webkit-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}

.title-3  {font-size: 4.5rem;
    
    line-height: 40px;
    font-weight: 500;
    line-height: 6.5rem;}

.lookbook__product--content__title {
    font-size: 1.5rem;
    line-height: 1.9rem;
    margin-bottom: 0rem;
    font-weight: 400;
    color:#575757;
}
.lookbook__product--content__title span {display: block;margin-bottom: 5px;font-size: 1.6rem;color: #232323;text-align: center}
.earth {padding:20px 40px;margin:30px 0}
.earth img {margin-bottom: 10px;padding:0 20px}
.earth h4 span {display: block;margin-bottom:10px;font-size: 2.0rem;font-weight: 600;color: #fbd783}
.earth h4 {font-size: 1.4rem;color: #fff;text-align: center;padding:20px 30px;font-weight: 400}
.earth ul li {display: block;padding:15px 0;margin:0 0 20px 0;align-items: center ; }
.earth ul li span {}
.header__account a {color: #fff}
.header__sticky.sticky .header__account a{color:#000}
.title-img {width: 300px;display: block;margin:0 0 30px 0}
.main__footer.section--padding {padding:150px 0}
.footer__bg {
    background: #1a1a1b url("../img/slider/footBg.jpg") no-repeat right bottom; background-attachment: fixed;border-top:1px solid #fff}

.footer_add {border-bottom: 1px solid #fff;padding-bottom: 15px;margin-bottom: 20px}
.footer_add h3 {font-size: 2rem;text-align: center}
.footer-border {border-right:1px solid #fff}
.display-xs-item {display: none}
.herosection {min-height: 741px}
.grid__banner--title.title-banner_1 {font-size: 1.2rem;text-align: center}
.grid__banner--title.title-banner_2 {font-size: 3rem;text-align: center}
.grid__banner--desc.title-banner_3 {font-size: 1.6rem;text-align: center;margin-bottom: 4rem}
.grid__banner--btn.primary__btn {background-color: #474747;}
.slider__content {
    position: relative;
    z-index:inherit
}
.product__badge {
    width: 80px;
    height: 80px;
    font-size: 1.8rem;
    line-height: 2.4rem;
    background: var(--secondary-color);
    color: var(--text-white-color);
    font-family: var(--inter-fonts);
    position: absolute;
    top: 1.5rem;
    left: 1.5rem;
    text-align: center;
    border:3px solid #fff;
    box-shadow: 0 0 5px 0 rgba(0,0,0,.2);
    padding: 15px 0 0;
    border-radius: 50%;
    z-index: 65
}
.product__badge bold {font-size: 2.5rem;font-weight: 600;display: block;margin-bottom: 3px}
.product_Edit {
    width: 60%;
    font-size: 1.4rem;
    line-height: 2rem;
    position: absolute;
    top: 1.5rem;
    right: 0;
    text-align: center;
    border-radius: 0.4rem;
    padding: 5px 8px;
    z-index: 65
}
.product_5 {padding:200px 0;background: url("../img/banner/pr005.jpg") no-repeat center;background-size: cover;}
.pro_item {padding:10px 20px;position: relative}
.pro_line {border-radius: 150px;border:1px solid #7E6B5E;padding:15px}
.pro_frame {border-radius: 140px;overflow: hidden;text-align: center;align-items: center}
.pro_frame img {}
.pro_des {padding:40px 50px 20px 50px;text-align: center}
.pro_des-title {margin-bottom: 15px;font-size: 1.8rem;font-weight: 600}
.pro_des-cont {margin-bottom: 15px;font-size: 1.4rem;  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;}
.pro_des-price {margin-bottom: 15px;font-size: 1.8rem;font-weight: 600}
.pro_des-btn {}
.offcanvas__menu_item {
    line-height: 1;
    display: block;
    padding: 20px 20px;
   
    color: #f4e5ab;
    font-size: 1.8rem;
}
.offcanvas__sub_menu_item {
    line-height: 1;
    display: block;
    padding: 15px 0 15px 30px;
    color: var(--primary-color);
    font-size: 1.5rem;
}
.offcanvas__sub_menu {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: #5d5d5d;
}
.offcanvas__sub_menu_li {
    position: relative;
    border-top: 1px solid #ffffff;
}
.offcanvas__sub_menu .offcanvas__sub_menu {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: #e9c3b3;
}
 .header__minicart--items {display: block}
.header__sticky.sticky .offcanvas__header--menu__open--btn , .offcanvas__header--menu__open--btn {
    color: #958247 !important;
}
.cart__summary {
    -webkit-box-shadow: 0 2px 22px rgba(0, 0, 0, 0.16);
    box-shadow: 0 2px 22px rgba(0, 0, 0, 0.16);
    padding: 3rem;
    background: var(--body-background-color);
    position: -webkit-sticky;
    position: sticky;
    top: 90px;
    margin-top: 90px;
}
.cart__summary--amount span {font-weight: 600;font-size: 36px;}
 #scroll__top {
        bottom: 15%;
    }
.videoBg {padding-top:8%;text-align: center;font-size: 40px;color:#fff;height: 100vh;}

.videoBg h1 {text-align: center;font-size: 80px;color:#fff;font-weight: 400;margin-bottom: 40px;letter-spacing: 1rem}
.videoBg h4 {text-align: center;font-size: 20px;color:#fff;}
#background-video {
   width: 100vw;
   height: 100vh;
   object-fit: cover;
   position: fixed;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   z-index: -1;
}
.lookbook__banner--section {padding:100px 0;background-color: #faf0f0}
.product__details--info__desc {
    font-size: 1.8rem;
       white-space: pre-line;
       line-height: 3rem}

    .grid__banner--content.margin__left {
        margin-left: 4rem;padding:10px 0
    }

.table.esre {width: 100%;border:1px solid #BFBFBF}
 .table.esre thead>tr>th {padding: 20px 15px;font-size: 1.6rem;background-color: #CFCFCF;text-align: center;align-items: center;vertical-align: middle;word-break: keep-all}
.table.esre tbody>tr>td {padding: 20px 15px;font-size: 1.4rem;background-color: #fff;text-align: center;align-items: center;vertical-align: middle;word-break: keep-all}
.table.esre tbody>tr>td span {color: #733F30;font-size: 1.6rem}
   .blog__post--meta {
    font-size: 1.4rem
}
.post__header--title {
    margin-top: 20px;
    font-size: 2rem;
    line-height: 2.8rem;
    color: var(--primary-color);
}
.text-line {
    font-family: var(--font-heading);
    color: transparent !important;
    -webkit-text-stroke: .6px #f8edcc;
    text-transform: uppercase;
    font-size: 9.5rem;
    line-height: 11rem;
    font-weight: 800;
}
.text-line_2 {
    font-family: var(--font-heading);
    color: transparent !important;
    -webkit-text-stroke: .9px #fff;
    text-transform: uppercase;
    font-size: 7.5rem;
    line-height: 9rem;
    font-weight: 800;
}
.text-line_3 {
    font-family: var(--font-heading);
    color: transparent !important;
    -webkit-text-stroke: .7px #fff;
    text-transform: uppercase;
    font-size: 6.5rem;
    line-height: 8rem;
    font-weight: 800;
}
.text-colorlight {color:rgb(255 255 255 / 80%);font-size: 7.5rem;
    line-height: 9rem;
    font-weight: 800;}
.text-colorlight_A {color:rgb(255 255 255 / 80%);font-size: 7.5rem;
    line-height: 9rem;
    font-weight: 800;}
@media only screen and (min-width: 1366px) {
    .lookbook__banner--content { padding: 5px 150px; }
}
@media screen and (max-width: 1024px) {
	.lookbook__banner--content { padding: 5px 80px; }
	.videoBg {
    padding-top: 15%;
		padding-bottom: 200px;
    text-align: center;
    font-size: 40px;
    color: #fff;
    height: inherit;
}
}
@media only screen and (max-width: 991px) {
    #scroll__top {
        bottom: 20%;
    } 
    .main__footer.section--padding {
    padding: 60px 0 120px 0;
}
}
@media only screen and (min-width: 992px) {
    
    .footer__widget--title { margin-top: 2rem; }
    .footer__widget--info__text { line-height: 3.4rem; }
   
}
@media only screen and (max-width: 767px) {
     .hero__word {position: absolute;z-index: 4;top:10%;left: 0;width: 100%;height: auto}
    .slider__items--inner {
        padding-bottom: 7rem;
    }
}
   @media only screen and (max-width: 767px) {
    .account__table--header {
        display: block;
    }
} 
@media only screen and (max-width: 575px) {
    .pro_img_center {max-width: 300px}
    .custom-btn {
     padding: 5px 10px;
  font-size: 13px;
    
}
    .text-box p {
    
    line-height: 1.4;
    font-size: 1.2rem;
}
    
    .product_3 {padding:50px 0 600px 0;background:#f7e0d7 url("../img/banner/pr002-M.jpg") no-repeat center bottom;background-size: cover;position: relative}
   
    .product_funtion_icon img {max-width: 100px;
}
    .product_5 {padding:50px 0 500px 0;background: url("../img/banner/pr005-M.jpg") no-repeat center bottom;background-size: cover;}
  .text-colorlight_A {color:rgb(255 255 255 / 80%);font-size: 6.5rem;
    line-height: 9rem;
    font-weight: 800;}
    .pro_img img {display: block;margin: 0 auto 20px auto}
    .product_4 {
    padding: 100px 0;
    position: relative;
}
    .display-container {
    width: 100%;
    height: 300px;
    position: relative;
}
    .text-box {bottom:200px;bottom:inherit}
    .word_back {position: absolute;top:-330px;left:20px;z-index: 1}
    .cooper_4 {padding:150px 0;background:url("../img/slider/section_4A-M.jpg") no-repeat center}
    .cooper_who {padding:30px 10px;}
    .cooper_2 {padding:120px 0;}
    .cooper_3 {padding:400px 0 150px 0;}
    .cooper_who-title {text-align: center}
    .cooper_title {display: block;margin:20px 0 50px 0}
    .about_7 {
    padding: 100px 0;}
    .section_diff {padding:100px 20px 30px 20px}
    
    .footer-border {border-right:0px solid #fff}
    .text-line {
    
    font-size: 6.5rem;
    line-height: 8rem;
    font-weight: 800;
}
    .header__account--items {display: none}
    .post__header--title {
    
    font-size: 1.6rem;
    
}
    .blog__post--meta {
    font-size: 1.3rem
}
    .section__heading h2 {font-size: 1.4rem}
    .variant__color--list {
    margin-right: 0px;
    margin-bottom: 20px;
    width:96%;
        display: block
}
    .table.esre thead>tr>th {padding: 20px 15px;font-size: 1.6rem;background-color: #CFCFCF;text-align: center;align-items: center;vertical-align: middle;word-break: keep-all}
.table.esre tbody>tr>td {padding: 20px 15px;font-size: 1.4rem;background-color: #fff;text-align: center;align-items: center;vertical-align: middle;word-break: keep-all}
    .table.esre {width: 100%; overflow-x: auto;display: block}
    .grid__banner--content.margin__left {
    margin-left: 0rem;
    padding: 40px 10px;
}
    .product__details--media {
    padding: 0 10px 10px;
}
    .product__details--info__desc {
    font-size: 1.6rem;
}
    .footer_add h3 {
    font-size: 1.8rem;
    text-align: center;
}
    .product__details--info__title {font-size: 2.4rem;}
    .lookbook__banner--section {padding:50px 0}
    .lookbook__banner--content { padding: 5px 50px; }
    .videoBg {padding:150px 0;text-align: center;font-size: 40px;color:#fff;}

.videoBg h1 {text-align: center;font-size: 70px;color:#fff;font-weight: 600;margin-bottom: 40px;}
.videoBg h4 {text-align: center;font-size: 18px;color:#fff;}
    .header__minicart--items {display: none}
    .home_section {padding: 650px 0 60px;
        background: url(../img/slider/section_2-M.jpg) no-repeat center top;}
    .home_section.about {padding:50px 0 550px 0;background: url("../img/banner/about01-M.jpg") no-repeat center}
    .home_section.about_4 {padding:100px 0 400px 0 ;background: url("../img/banner/about03-M.jpg") no-repeat center bottom}
    .home_section_3 {padding:100px 0 550px 0;background: url("../img/slider/section_3-M.jpg") no-repeat center bottom}
.home_section_3 .slider__desc {font-size: 1.7rem;line-height: 30px}
.home_section_4 {padding:100px 0 380px 0;background: url("../img/slider/section_4-M.jpg") no-repeat center top}
    .grid__banner--title {font-size: 3.6rem;text-transform: uppercase;line-height: 4.2rem}
    .product_move {max-width: 300px;bottom:5%}
    .section_left {
    background: #f7e0d7 url(../img/banner/about02A.jpg) no-repeat center bottom;
    background-size: inherit;
    position: relative;
    min-height: 600px;
}
    .home_section_5 {
    padding: 250px 0;
    background: url(../img/slider/SS002.jpg) no-repeat center;
}
     .hero__word {position: absolute;z-index: 4;top:10%;left: 0;width: 100%;height: auto}
  .slider__content .title {font-size: 4.5rem;color:#fff;line-height: 40px;font-weight: 500}
.slider__content .title-2 {font-size: 3.1rem;color:#fff;line-height: 30px;font-weight: 500}
    .title-3  {font-size: 3rem;line-height: 36px;font-weight: 500}
    .title-img {margin:0 auto 30px auto}
    .display-xs-item {display: block;margin: 0 auto;width: 300px}
    .herosection {min-height: inherit}
}
    
    