@charset "utf-8";
/*瀧濠空間設計*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');

:root{
    --MainColor:#222;
    --SubColor:#777;
}

body {font-family: 'Noto Sans TC', sans-serif;letter-spacing: 1px;}
#content{background: #111;}
#content_main{background: #111;}

/*錨點滾動*/
html { scroll-behavior: smooth; }
::-webkit-scrollbar {width: 4px;}
::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(102, 102, 102, 0.6); }
::-webkit-scrollbar-thumb {background-color: var(--MainColor);border-radius: 50px;}

/*大圖================================*/
/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex { position:static; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
.swiper-slide img { height:auto;}

@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0;}
}

/*側邊按鈕=============================*/
.info_fix {width: 50px;right: 0px;bottom:115px;}
.info_fix_links{display: flex !important;}
.info_fix>span{display: none;}
.info_fix_links a{border-radius: 0px;background: var(--SubColor);border-bottom: 1px solid #fff;margin-bottom: 0px;}
.info_fix_links a:hover{background-color: var(--MainColor);}
a.info_fix_default.info_fix_mail{display: none;}
a.info_fix_default.info_fix_tel{display: none;}

/*TO TOP*/
#to_top{bottom: 85px;right: 0px;background: var(--SubColor);box-shadow: unset;color: #ffffff;left:unset;border-radius: 0;}
#to_top i:before, #to_top i:after{background: #ffffff;height: 10px;top: 3px;}
#to_top i.top{height: 15px;}

/*header=============================*/
.me_tp_features {display: none; }
.pageIndex .header_area {position: fixed;width: 100%;transition: all 0.3s ease-in-out;background: linear-gradient(0deg, transparent, #00000052);padding: 0;box-shadow:unset;}
.tp_links a { display: none; }
.pageIndex .header_area.sticky .main_header_area {background: #222;transition: all 0.3s ease-in-out;box-shadow: 1px 1px 15px rgba(38,15,1,.2);}
.pageIndex .main_header_area { background: #fff0; }
.main_header_area { background: #222;height: 60px; }
.nav-header {position: relative;left: 50%;transform: translateX(-50%);text-align: center;z-index: unset;}
.header_area{padding: 0;box-shadow: 1px 1px 15px rgba(38, 15, 1, .2);}

@media screen and (max-width: 1024px) {
.main_header_area{height: 95px;}
}

@media screen and (max-width: 768px) {
    .pageIndex .header_area{position: sticky;transition:none;}
    .pageIndex .header_area.sticky .main_header_area{transition:none;}
    .pageIndex .main_header_area{background: #222;}
    .main_header_area{height: 60px;}
}

/*HEADER選單=================*/
.stellarnav > ul > li > a b{font-family: 'Gruppo', sans-serif;font-weight: 500;}
.pageIndex .stellarnav > ul > li > a {font-size: 15px;letter-spacing: 0.1em;margin: 0 15px;color: #fff;}
.header_area.sticky .stellarnav>ul>li>a {color: #fff;letter-spacing: 0.1em;transition: all 0.3s ease-in-out;}
.stellarnav > ul > li > a:hover { color: #ddd;transition: 0.3s; }
.stellarnav > ul > li > a {letter-spacing: 0.1em;margin: 0 15px;color: #ffffff;}
.stellarnav li.has-sub > a:after{content: '+';border-left: none;border-right:none;border-top:none;}
.sticky .stellarnav> ul > li > a:hover {color: var(--SubColor);}
.stellarnav ul{text-align: right;}
.stellarnav > ul > li{top: 9px;}

/*下拉選單*/
.stellarnav ul ul{background: #000000c7;backdrop-filter: blur(5px);}
.stellarnav li li{border: none;}
.stellarnav li li:hover > a, .stellarnav li li.has-sub:hover > a {color: #fff;padding-left: 11px;background: #111;}
.stellarnav li {font-size: 14px;}
.stellarnav li a{font-weight: 200;color: #ffffff;}


@media screen and (max-width: 1024px) {
    .stellarnav ul{text-align: center;height: 45px;}
    .stellarnav > ul > li{top: 5px;}
}
@media screen and (max-width: 768px) {
.pageIndex .stellarnav > ul > li > a { color: #fff; }
.stellarnav ul{margin-top: 0px;height:auto;}
}

/*選單最大寬度設定*/
.main_header_area .container{max-width: 80%;}

/*LOGO設定===================*/
.nav-brand img{filter: brightness(10.5);max-width: 100%;position: relative;top: 10px;}
.nav-brand {display: inline-block;width:200px;}

@media screen and (max-width: 1024px) {
    .nav-header{left: unset;transform: none;}
    .nav-brand img{top: 10px;}
}

/*BANNER==============================*/
.banner.banB{display: none;}
.banner.banblog h5:before{
    content: '日常紀錄';
    display: block;
    font-family: 'noto sans TC', sans-serif;
    font-size: 20px;
}
.banner.banE h5:before {
    content: '作品欣賞';
    display: block;
    font-family: 'noto sans TC', sans-serif;
    font-size: 20px;
}
.banner.banC h5:before{
    content: '預約估價';
    display: block;
    font-family: 'noto sans TC', sans-serif;
    font-size:20px;
}
.banner h5:after{
    content: '+';
    display: block;
}
.banner{
    background-image:url(https://pic03.eapple.com.tw/lhdesignstudio/banner.png);
    min-height: 600px;
    background-repeat: no-repeat;
    background-position: center;
}
.banner h5 {
    font-weight: 100;
    color: #fff;
    text-shadow: 0 0 black;
    font-family: 'Quicksand';
}

/*相簿================================*/
/*首頁相簿*/
.module_i_album{background: #111;padding: 100px 20px;}
.module_i_album .title_i_box h6{font-size: 20px;color: #ffffff;font-weight: 100;text-align: left;}
.module_i_album .title_i_box h4{font-size: 60px;color: #ffffff;font-weight: 100;font-family: 'Quicksand';text-align: left;}
.i_album_list{grid-template-columns: repeat(2, 1fr);}
.i_album_list li a p{background: rgb(123 123 123 / 60%);color: #ffffff;backdrop-filter: blur(5px);}
.animated-arrow{background: #444;}
.fa-arrow-right::before{content: "MORE+";font-family: 'Quicksand';font-weight: 100;}

@media screen and (max-width: 550px) {
    .i_album_list{grid-template-columns: repeat(1, 1fr);}
}

/*主分類*/
.show-list{grid-template-columns: repeat(auto-fill, minmax(550px, 1fr));}
.album_page .main_part{max-width: 2000px;background: #111;animation: noise 1.5s steps(5) alternate infinite;}
.show-list .item {margin: 5px;padding: 0;}
.show-list .show_name {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);font-size: 20px;font-weight: normal;
	height: auto;text-align: center;text-shadow: 0 0 5px rgba(0,0,0,0.5);z-index: 1000;width: 100%;color: #ffffff;}
.overlay{opacity: 1;transform: scale(1);z-index: 999;background:rgb(0 0 0 / 14%)}
.show-list .item:hover .overlay{opacity: .2;transform: scale(1);}
.show-list .item .show_pic img{transform: scale(1);transition: all .6s;}
.show-list .item:hover .show_pic img{transform: scale(1.1);}
.subbox_item a:before {background: rgba(41,48,54,0.8);color: #fff;font-weight: normal;font-size: 16px;border: 1px solid #ccc;}
.subbox_item a:after {width: auto;}
.show-list .item:hover .show_name{color:var(--SubColor);}
ul.show-list.clearfix{text-align: center;}

/*次頁*/
.album_info_page .main_part{max-width: 2000px;}
.pic-list {column-count: 2;column-gap: 10px;display: block;}
.pic-list .item {width: 100%;margin: 0px;padding: 0;}
.pic-list .show_pic {height: auto;padding-bottom: 0;}
.pic-list .show_pic img{width: 100%;}
.album_fixed_title{display: none;}
.other_album:before{display: none;}
.lightbox .lb-image {border: 2px solid #ddd;}
.lightboxOverlay{opacity: 0.9;}
.subalbum-menu h2{color: #ffffff;font-weight: 200;}
.other_subalbum li{background: #ffffff00;}
.other_subalbum li a p{color: #fff;text-align: center;margin-top: 10px;}
.album_descrip{color: #ffffff;text-align: center;}

/*更多相簿按鈕*/
.other_album_choice{text-align: center;display: flex;flex-wrap: wrap;justify-content: center;}
.other_album_choice li {border-radius: 0px;width: 15%;border-top: none;background: var(--MainColor);padding: 0;}
.other_album_choice li:hover{background: var(--SubColor);}
.other_album_choice li a{display: block;padding: 15px;font-weight: 200;}
.other_album_choice li .fa {display: none;}
.fa-right-from-bracket::before{content: "→";}

@media screen and (max-width: 768px) {
    .other_album_choice li{width: 40%;}
}

/*相簿瀑布流*/
.album_info_page .pic-list { 
    -moz-column-count:3; 
    -moz-column-gap:10px; 
    -webkit-column-count:3; 
    -webkit-column-gap:10px; 
    column-count:3; 
    column-gap:10px; 
    width:100%; 
    margin:0 auto; 
}
.album_info_page .pic-list .item { 
    width:100%; 
    -webkit-column-break-inside: avoid; 
    page-break-inside: avoid; 
    break-inside: avoid; 
    padding: 0; 
    margin: 0;
}
.album_info_page .pic-list .show_pic { 
    height:auto; 
    padding:0;
}

@media (max-width: 1440px){
    .album_info_page .pic-list{ 
        -moz-column-count:3; 
        -webkit-column-count:3;  
        column-count:3;
}
}
@media screen and (max-width: 1024px) { 
    .contact_page .main_part{display:block;}
    .contact_content {
        padding: 10px;
        width:100%;
}
}
@media (max-width: 768px) {
    .album_info_page .main_part{padding: 50px 0;}
    .other_album{padding: 0 16px;}
    .other_album:before{width: 0;}
    .album_info_page .pic-list{ 
        -moz-column-count:2; 
        -webkit-column-count:2;  
        column-count:2;
    }
    .product-layer-two li {
        display: inline-block;
        margin: 0px 10px 0px 0;
        padding: 5px 0;
        position: relative;
    }
    .product-layer-two {
        display: block;
        width:100%
    }
    .product-layer-two {
        margin: 20px 0;
}
    .product_page .show_content, .product_info_page .show_content{display:block;}
    .products-list, .product-wrapper {width: 100%;}
    .product-layer-two li:hover li { display: none;}
    .product-layer-two > li{width:auto;}
    .product-layer-two li li{display:none;}
    .show_content{padding: 15px 20px;}
}
@media (max-width: 480px) {
    .album_info_page .pic-list{
        -moz-column-count:1;  
        -webkit-column-count:1; 
        column-count:1;
    }
}

/*相簿第二層*/
.other_subalbum li p {    margin-top: 10px;}
.other_subalbum li a img{    
    object-fit: cover;
    min-height: 250px;
}

/*頁籤*/
.page{padding-top: 80px;}
.page strong, .page a {border: none;background: transparent;}
.page strong, .page a:hover {background: transparent;}

@keyframes noise {
    0% {      background-position: -88px 166px    }
    20% {      background-position: 222px -333px    }
    40% {      background-position: -111px 444px    }
    60% {      background-position: 33px -66px    }
    80% {      background-position: -138px 212px    }
    100% {      background-position: 317px -197px    }
}

@media screen and (max-width: 500px) {
    .show-list{grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));}
}

/*文章管理============================*/
.blog_le{position: sticky;display: inline-block;top: 120px;}
.blog_le .accordion>li:hover .link { background: #a5a5a5; }
.subbox_item a:before { display: none; }
.blog_list_ri:after {content: 'READ MORE >';display: block;background: transparent;color: #777;letter-spacing: 1px;
    opacity: 1;left: 0;position: relative;padding: 0 22px 0 0;font-size: 12px;line-height: 12px;}
.blog_list_ri em { display: none; }
.blog_back a.article_btn_back { background: var(--SubColor); }
.blog_back a.article_btn_prev, .blog_back a.article_btn_next {background: var(--MainColor);color: #fff;transition: all 0.3s ease-in-out;}
.blog_back a.article_btn_prev:hover, .blog_back a.article_btn_next:hover {background: var(--SubColor);color: #FFF;}
.blog_search input[type=search] { border-radius: 2px; background: transparent;}
.blog_search input[type=submit]{width: 0;}
.blog_le .accordion { border-radius: 2px; }
.blog_subbox.clearfix {margin: 0 auto;display: grid;grid-gap: 15px;grid-template-columns: 1fr 1fr 1fr 1fr;}
body.blog_page .clearfix:before,
body.blog_page .clearfix:after { display: none; }
.subbox_item {background-color: transparent;overflow: hidden;position: relative;width: 100%;border-bottom: none;}
.subbox_item a {display: flex;flex-wrap: wrap;flex-direction: column;grid-gap: 5px;}
.subbox_item:hover img {transform: translate(-50%, -50%) scale(1.05);object-fit: cover;width: 100%;transition: all 0.4s ease;}
.blog_list_le img {display: block;max-width: 100%;min-width: 100%;object-fit: cover;position: absolute;
    left: 50%;top: 50%;transition: all 5000ms cubic-bezier(0.190, 1.000, 0.220, 1.000);transform: translate(-50%, -50%) scale(1);}
.blog_list_le {display: block;position: relative;text-align: center;height: auto;aspect-ratio: 9 / 9;overflow: hidden;padding-bottom: 0;width: 100%;}
.subbox_item a:after { display: none; }
.blog_list_ri { width: 100%; }
.blog_list_ri h5 {position: relative;margin: 10px 0 0;font-size: 18px;letter-spacing: 0.035em;color: #ffffff;}
.blog_list_ri p {color: #fff;margin: 15px 0 0;font-size: 14px;letter-spacing: 0.035em;width: 100%;padding: 0;margin: 10px 0;padding-top: 8px;}
.main_part { max-width: 1500px; }
.blog_le .accordion > li:hover .link, .blog_le .accordion > li.on_this_category .link {color: #fff !important;background: var(--SubColor);transition: 0.3s;}

@media screen and (max-width: 1494px) {
    .blog_subbox{grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));}
}
@media screen and (max-width: 1024px) {
	.blog_subbox.clearfix {margin: 0 auto;display: grid;grid-gap: 30px;grid-template-columns: 1fr 1fr 1fr;}
    .blog_subbox{grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));}
}
@media screen and (max-width: 768px) {
    .blog_subbox.clearfix {margin: 0 auto;display: grid;grid-gap: 10px;grid-template-columns: 1fr 1fr;}
    .blog_le{position: relative;top: 0px;}
}
@media screen and (max-width: 425px) {
    .blog_subbox.clearfix {grid-template-columns: 1fr;}
}

/*第二層*/
.blog_shareData{justify-content: flex-end;}
.articel_mainPic img{max-width: 50%;}
.news_related{display: none;}
h5.blog_le_t, h4.blog_category_title {font-size: 25px;margin-bottom: 10px;color: #ffffff;}
.toShareNews b, .toShareNews a, .toShareNews a object, .toShareNews a i{color: #fff;}
.blog_box_edit{color:#fff;}

/*文章分類ARTICLE*/
h5.blog_le_t em {font-size: 20px;letter-spacing: 0.1em;}
h5.blog_le_t span { font-size: 20px; }
h5.blog_le_t{color: #ffffff;}
.accordion li .link a{color: #ffffff;}

/*聯絡我們============================*/
body.contact_page .main_part {max-width: 100%;margin: auto;width:60%;}
.contact_content {padding: 0;}
.contact_content .information_left {display: initial;}
.information_left.fadeInLeft.animated15.clearfix {display: none;}/*聯絡資訊隱藏*/
.list_before.info iframe {width: 100%;height: 50%;}
.contact_form li{grid-template-columns: 120px 1fr;}

@media screen and (max-width: 1200px) {
    .list_before.info {width: 100%;}
}
@media screen and (max-width:768px) {
    body.contact_page .main_part {width:85%;}
}
@media screen and (max-width: 600px) {
    .contact_form li{grid-template-columns: 1fr;}
    .contact_form li .form__label{max-width: 100%!important;background: #444;}
}

.list_before {margin-top: 0px;}
.contact_content .information_right {width: 100%;padding-left: 0px;}
.blank_letter {text-align: center;padding: 3% 1% 1% 1%;color: #fff;font-weight: normal;font-size: 1.2rem;letter-spacing: 2px;border-bottom: 1px solid;}
.list_before.info li:last-child {padding-left: 41px;margin-top: 5px;}
.list_before.info li:first-child {margin-top: 15px;}
.list_before.info {max-width: 100%;color: #fff;}
.contact_form li .form__label { padding-right: 5px;max-width: 120px;color: #fff;}
.contact_le_map { display: none; }
.list_before { margin-bottom: 15px; }
.line_id::before{content:"Line ID";}
.list_before.info li, .list_before.info li:last-child {padding-left: 55px;}
.TEL:before, .TEL2:before, .PHONE:before, .FAX:before, .TAXID:before, .MAIL:before, .ADD:before, .ADD2:before{width: 50px;}
.contact_form li.last cite{background: var(--SubColor);}
.contact_form li.last blockquote, .contact_form li.last cite{border: 1px var(--SubColor) solid;}
.contact_form li.last{text-align: center;margin-top: 50px;}
.contact_form li:has(input[type=radio]) .form__insert {display: flex;gap: 5px;color: #fff;}
.contact_form li input.noborder{background: transparent;border: 1px #777 solid;color: #fff;}
.form select{color: #ddd;background: #111;}
.contact_form li textarea.noborder{background: transparent;color: #fff;}
.contact_form li.last blockquote{color: #ffffff;}

/* 上下顛倒 */
.contact_content form.style1 {display: flex;flex-wrap: wrap-reverse;}
.information_left.fadeInLeft.animated15.clearfix {width: 100%;}

@media screen and (max-width:600px) {
    .contact_form li .form__label{width:100%;}
}

/*FOOTER==============================*/
.box_link a { display: none; }
.footer {background: #222;padding:25px 0 0;box-shadow: 1px 1px 15px rgb(38 15 1 / 37%);}
.footer .center {position: relative;max-width: 1300px;}
.footer_info {display: flex;flex-wrap: wrap;align-items: center;justify-content: center;padding: 0px;flex-direction: column;margin-bottom: 20px;}
.footer_menu {display: grid;grid-template-columns: 1fr 1fr;gap: 12px 5px;}
.footer_menu a {margin: 0;text-align: left;padding: 0;transition: all 0.3s;border: none;background: transparent;color: #fff;display: block;width: fit-content;}
.footer_menu a:before { content: "·"; }
.footer_menu a:nth-child(1) { display: none; }
.footer_menu a:hover {background: transparent;color:var(--SubColor);}
.copy {background: #434343;border:none;margin-top: 0px;position: relative;padding: 15px 0;color: #fff;}
.copy a{color: #fff;transition:all 0.3s;}
.footer_info li { padding: 10px 25px; }
.footer_info ul>li:before {font-size: 115%;color: #fff;display: block;margin: 0 0 20px;border-bottom: 1px solid var(--SubColor);padding-bottom: 10px;letter-spacing: 0.2em;font-weight: bold;}
.footer_info ul>li:nth-child(1):before { content: "CONTACT"; }
.footer_info ul>li:nth-child(2):before { content: "MAIN MENU"; }
.footer_info li:nth-child(1) a, .footer_info li:nth-child(1) p {color: #fff;letter-spacing: 0.15em;}
.footer_info ul {display: grid;grid-template-columns: repeat(auto-fit, minmax(min(300px,100%), 1fr));gap: 0 20px; letter-spacing: 0.15em;}
.footer_logo img { width: 100%;filter: brightness(10.5); }
.footer_logo {display: inline-block;vertical-align: top;width:200px;margin: 0px;}
.footer_info li:nth-child(1) p.taxid{display: none;}/*隱藏統編*/

/*RWD====*/
@media screen and (max-width: 768px) { 
.footer_info li { 
    flex-direction: column; } 
.product_page .products-list {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: 1fr 1fr;
}
.footer{padding: 25px 0 54px;}
}

/*手機版選單*/
.stellarnav .menu-toggle:after{display: none;}
.stellarnav .menu-toggle span.bars span{background: var(--SubColor);}
.sticky .stellarnav .menu-toggle span.bars span{background: var(--SubColor);}
.stellarnav .menu-toggle, .stellarnav .call-btn-mobile, .stellarnav .location-btn-mobile, .stellarnav .close-menu{padding: 20px 10px;}
.stellarnav .menu-toggle span.bars span{height: 1px;width: 30px;}
.stellarnav .menu-toggle span.bars{top: 5px;}

/*第二層*/
.stellarnav.mobile.left .close-menu{background: var(--SubColor);color: #fff;}
.stellarnav .icon-close:before{border-bottom: solid 3px #ffffff;}
.stellarnav .icon-close:after{border-bottom: solid 3px #ffffff;}
.stellarnav.mobile.right > ul, .stellarnav.mobile.left > ul{background: #222;}

/*bottom menu*/
#bottom_menu li a{background: #111;color: #fff;}
#bottom_menu li{border-right: 1px solid #444;}