@charset "utf-8";
/*●●●●●●●●●●●●●●●●●●●●●●●●   大範圍設定   ●●●●●●●●●●●●●●●●●●●●●●●●*/
body {background: #EDEEEA;}
*{font-family:  "Arial","Noto Sans TC", sans-serif;}
#content_main{margin-top: 0;background: transparent;}
.main_part {padding: 0 0 80px;max-width: 1500px;width: 90%;}
.show_content{padding: 0;}
.path {padding: 0;margin: 80px 0 30px;}
.path p a{transition: all .5s;}
.path p a:hover {color: #9c947e;}

@media screen and (max-width: 768px){
	.path {margin: 100px 0 20px;}
	.path p, .path p a {text-align: left;font-size: 10px;}
	#to_top{bottom: 30px;font-size: 10px;}
}

/*●●●●●●●●●●●●●●●●●●●●●●●●   大圖設定   ●●●●●●●●●●●●●●●●●●●●●●●●*/
.bannerindex {margin-top: 100px;position: relative;overflow: inherit;}


/*中文文字↓*/
.bannerindex .swiper-banner .swiper-slide.swiper-slide-active{overflow: inherit;}
.bannerindex .swiper-banner .swiper-slide.swiper-slide-active:before{content: "";white-space: pre;
	font-size: 14px;position: absolute;left: 50%;bottom: calc(100% - 85px);transform: translateX(-50%);z-index: 10000;
	text-align: right;width: 85%;color: #595555;line-height: 1.6;letter-spacing: .2rem;
	animation: totop 1s both;animation-delay: 1s;max-width: 1600px;font-family: "微軟正黑體";}
.bannerindex .swiper-banner .swiper-slide.swiper-slide-active:nth-child(1):before{content: "以水之廣，納百川；以理之和，序萬象";}
.bannerindex .swiper-banner .swiper-slide.swiper-slide-active:nth-child(2):before{content: "在有限的空間裡，創造無限的美學可能";}
.bannerindex .swiper-banner .swiper-slide.swiper-slide-active:nth-child(3):before{content: "以水之廣，納百川；以理之和，序萬象\A在有限的空間裡，創造無限的美學可能";}
/*圖片超出邊界隱藏色塊↓*/
.bannerindex .swiper-banner .swiper-slide:after{content: "";width: 100%;height: 100%;max-width: 1800px;
    position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 100;
    background: transparent;border: 100px solid #EDEEEA;border-bottom: 150px solid #EDEEEA;}
.bannerindex .swiper-banner .swiper-slide img {width: 90%;max-width: 1600px;margin: 0 auto;
    height: 85vh;object-fit: cover;}
/*切換鈕↓*/
.swiper-pagination-bullets.swiper-pagination-horizontal{bottom: 70px;}
.swiper-pagination-bullet{height: 7px;width: 7px;background: #595555;}
.swiper-pagination-bullet-active {width: 50px;border-radius: 20px;}

    
@keyframes totop{
	0%{opacity: 0;}
	100%{opacity: 1;}
}



@media screen and (max-width: 1024px){
	.bannerindex{overflow: hidden;height: 85vh;margin-top: 0;}
	.bannerindex .swiper-banner .swiper-slide.swiper-slide-active:before{bottom: 150px;color: #fff;
		text-shadow: 0 0 10px rgba(0,0,0,.5);text-align: center;}
	.bannerindex .swiper-banner .swiper-slide:after{border:none;}
	.bannerindex .swiper-banner .swiper-slide img{width: 100%;filter: brightness(.8);}
	/*切換鈕↓*/
	.swiper-pagination-bullets.swiper-pagination-horizontal{bottom: 50px;}
}


/*●●●●●●●●●●●●●●●●●●●●●●●●   HEADER區塊   ●●●●●●●●●●●●●●●●●●●●●●●●*/
.header_area {background: #EDEEEA;padding: 0;position: sticky;top: 0;transition: all .5s;
	transition-timing-function: cubic-bezier(0.4, 0, 1, 1);}
.header_area.sticky{background: #EDEEEA;}
.pageIndex .header_area {position: fixed;top: 0;}
.main_header_area .container {max-width: 1800px;width: 90%;margin: 0 auto;}
.nav-header {max-width: 150px;}
.stellarnav > ul > li {padding: 30px 1%;}
.stellarnav > ul > li:nth-of-type(4) > ul{display: none !important;} /*相簿下拉隱藏*/
.stellarnav > ul > li > a b{font-weight: 400;color: #202020;}
.stellarnav > ul > li > a b:last-child{font-weight: 300;}
.stellarnav > ul > li.has-sub > a {padding-right: 0;}
.stellarnav li.has-sub > a:after{display: none;}
.me_tp_features{display: none;}
/*---下拉*/
.stellarnav ul ul {background: #333;}
.stellarnav li li{border: none;border-bottom: 1px solid #3c3c3c;}
.stellarnav li li:last-child{border-bottom: none;}
.stellarnav ul ul li a {font-size: 12px;font-weight: 500;color: #eee;padding: 10px 12px;transition: all .5s;}
.stellarnav ul ul li a:hover{background: #ddd;color: #333;}

@media screen and (max-width: 1024px){
	.nav-header {padding-top: 15px;}
	.stellarnav > ul > li {padding: 10px 1%;}
}
@media screen and (max-width: 768px){
	.nav-header {padding: 15px 0;max-width: 130px;}
	.stellarnav.mobile {top: 6px;}
	.stellarnav .menu-toggle:after {margin-top: 8px;}
	.stellarnav .menu-toggle span.bars span {width: 30px;}
	.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {
		background: transparent;color: transparent;margin-bottom: 30px;}
	.stellarnav .icon-close {position: absolute;right: 23px;}
	.stellarnav .icon-close:before,.stellarnav .icon-close:after{width: 15px;border-bottom: solid 2px #555;}
	.stellarnav > ul > li > a b:last-child {font-size: 14px;margin-top: 1px;display: inline-block;color: #555;
		font-weight: 400;}
	.stellarnav > ul > li.has-sub.open > a:not(.dd-toggle) {padding: 15px 40px 15px 15px;}
	.stellarnav.mobile > ul > li {border-bottom: 1px #f3f3f3 solid;}
	.stellarnav.mobile > ul > li:nth-of-type(4) > a.dd-toggle{display: none;}/*相簿下拉隱藏*/
	.stellarnav.mobile > ul > li > a.dd-toggle {top: 10px;}
	.stellarnav a.dd-toggle .icon-plus:before,.stellarnav a.dd-toggle .icon-plus:after {border-bottom: solid 2px #777;}
	.stellarnav.mobile li li {border-bottom: none;}
	.stellarnav.mobile li.open{padding: 0;background: #fafafa;}
	.stellarnav.mobile li a {color: #555;}
	.stellarnav.mobile ul ul li a {padding: 12px 18px;}

}
@media screen and (max-width: 570px) {
    .stellarnav.mobile {top: 17px;}
}





/*●●●●●●●●●●●●●●●●●●●●●●●●   FOOTER區塊   ●●●●●●●●●●●●●●●●●●●●●●●●*/
.footer{background: #595656;padding: 0 0 20px;}
.footer .center {max-width: 1500px;width: 90%;}
.footer_logo {max-width: 150px;}
.footer_logo > a{background: url(https://pic03.eapple.com.tw/yxdesign/f_logo.png) no-repeat;
display: block;width: 100%;height: 100%;background-size: contain !important;background-position-y: bottom;}
.footer_logo > a img{display: none;}
.footer_info {grid-template-columns: 1fr 600px;padding-right: 0;}
.footer_info ul {display: grid;grid-template-columns: 250px 1fr;gap: 12%;transform: translateY(45px);}
.footer_info li{padding: 0;}
.footer_info li:nth-child(1){order: 1;}
.footer_info li p,.footer_info li p a{line-height: 2.2;color: #fff;font-size: 14px;font-weight: 300;}
.footer_menu a{background: transparent;border: none;padding: 0;margin: 0;line-height: 2.2;position: relative;
color: #fff;font-size: 14px;width: 43%;margin-right: 6%;transition: all .5s;}
.footer_menu a:before{content: "";width: 0;height: 1px;background: #c8bc9e;position: absolute;bottom: 0;left: 0;
transition: all .5s;}
.footer_menu a:first-child{display: none;}
.footer_menu a:hover{background: transparent;color: #d3cab5;}
.footer_menu a:hover:before{width: 100%;}
.box_link{display: none;}
.copy,.copy a{color: #c8bc9e;font-size: 10px;transition: all .5s;}
.copy {border: none;padding: 30px 0;max-width: 1500px;width: 90%;justify-content: flex-start;margin: 0 auto;}
.copy a:hover{color: #eee;}
.privacyLinks a+a {border-left: 1px solid #c8bc9e;}



@media screen and (max-width: 1024px){
	.footer {padding: 50px 0 20px;}
	.footer_logo {max-width: 130px;margin-bottom: 20px;}
	.footer_logo > a {height: 45px;}
	.footer_info {grid-template-columns: 1fr;}
	.footer_info ul {transform: none;grid-template-columns: 1fr;}
	.footer_info li:nth-child(2){display: none;}
}

@media screen and (max-width: 768px){
	#bottom_menu{display: none;}
}
@media screen and (max-width: 600px){
	.footer_info{padding: 0;}
	.total_view {display: inline;width: auto;}
}




/*●●●●●●●●●●●●●●●●●●●●●●●●   文章設定  ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*整體reset*/
.blog_box{padding: 0;display: flex;justify-content: space-between;flex-wrap: wrap;}
.blog_le, .blog_ri{padding: 0;margin-bottom: 0;}
.blog_box{display: flex;justify-content: space-between;}
/*側邊選單*/
.blog_le .accordion li{transition: all .5s;}
.blog_le .accordion li a{transition: all .5s;}
.blog_le .submenu {background: #fff;}
.blog_le .submenu a {padding: 12px 12px 12px 35px;font-size: 12px;}
.blog_le .submenu a i {left: 10px;}
.blog_le .submenu li.on_this_category a, .submenu a:hover {background: #aaa;}
.accordion li .link a{font-weight: 400;}
/*分類頁*/
.blog_ri {width: calc(100% - 280px);}
.blog_page h4.blog_category_title{display: none;}
.subbox_item a:before{bottom: 50%;right: 50%;transform: translate(50%, 50%);width: 142px;height: 48px;
    color: #333;font-family: "Raleway", sans-serif;background: #eee;line-height: 48px;font-size: 12px;text-align: center;
    font-weight: 500;}
.subbox_item a:after{border: none;background: rgba(255, 255, 255, 0.6);}
.subbox_item a{grid-template-columns: 1fr;grid-gap: 0;}
.blog_list_le {aspect-ratio: 4 / 3;}
.blog_list_ri {background: #fff;padding: 25px;}
.blog_list_ri h5 {-webkit-line-clamp: 2;}
.blog_list_ri p {-webkit-line-clamp: 3;font-size: 14px;line-height: 1.6;}
/*文章頁*/
h4.blog_category_title {font-size: 20px;padding: 0;font-weight: normal;border-bottom: 1px solid #ccc;
    padding-bottom: 20px;}
.articel_mainPic{display: none;}
.blog_back {grid-gap: 0;width: 100%;margin: 50px 0;}
.blog_back a.article_btn_prev,.blog_back a.article_btn_next {
	background: transparent;color: #888;border: 1px solid #888;font-size: 13px;padding: 12px;}
.blog_back a.article_btn_back{background: #888;padding: 12px;font-size: 13px;}
.news_related {background: transparent;border-top: 1px solid #333;padding: 50px 0;}
.news_related h6 span:before {color: #333;font-size: 20px;}
.news_related_list {max-width: 1300px;width: 90%;}
.news_related_list li > a {padding: 0;background: transparent;}
.news_related_list li > a p {line-height: 1.4;padding: 15px;}
.lastPage{font-size: 14px;background: #888;}


@media screen and (max-width: 768px){
	/*側邊選單*/
	.blog_le {margin: 0 0 20px;}
	h5.blog_le_t{font-size: 20px;}
	.blog_search input[type=search]{background: #fff;}
	/*分類頁*/
	.blog_ri {width: 100%;margin-top: 50px;}

}



/*●●●●●●●●●●●●●●●●●●●●●●●●   相簿區塊   ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*大分類*/
.show-list .show_name{font-weight: 500;font-size: 16px;}
/*相簿列表頁*/
.subalbum-menu{padding: 0;}
.subalbum-menu h2{color: #333;font-weight: 400;}
.other_subalbum li{background: transparent;}
/*觀看更多*/
.album_fixed_title{background: transparent;}
.other_album_choice li {background: #aaa;font-size: 13px;border-radius: 0;}
.other_album_choice li a i{display: none;}
/*首頁*/
.module_i_album{padding: 80px 0;}
.module_i_album section {width: 90%;max-width: 1500px;display: grid;grid-template-columns: 300px 1fr;
	gap: 0 6%;position: relative;}
.module_i_album .title_i_box {text-align: left;}
.module_i_album .title_i_box h6{display: none;}
.module_i_album .title_i_box h4{font-size: 30px;color: #595555;font-family: "Raleway", sans-serif;}
.module_i_album .title_i_box h4:before{content: "DESIGN";margin-right: 10px;}
.i_album_list_box{padding: 0;}
.i_album_list {grid-template-columns: repeat(3, 1fr);}
.i_album_list > li:nth-child(n+4){display: none;}
.show-list .show_pic {aspect-ratio: 3 / 4;}
.show-list .show_pic img{transition: all .8s;}
.show-list .item a p{padding: 10px;text-align: center;color: #202020;font-weight: 300;}
.overlay{display: none;}

.show-list .item a:hover .show_pic img {transform: scale(1.05);}


/*按鈕設定*/
.i_album_b {justify-content: flex-start;position: absolute;bottom: 0;}
.i_album_b .animated-arrow {width: 190px;background: transparent;border-radius: 30px;border: 1px solid #595555;color: #595555;
 font-family: "Raleway", sans-serif;font-size: 14px;}
.i_album_b .animated-arrow b{display: none;}
.i_album_b .animated-arrow:before{content: "READ MORE";position: absolute;top: 50%;left: 30px;transform: translateY(-50%);
	font-weight: 400;}
.i_album_b .fa-arrow-right::before {content: "→";color: #fff;font-family: "微軟正黑體";}
.i_album_b a i.fa-solid.fa-arrow-right{transition-delay: .5s;}
.i_album_b a i.fa-solid.fa-arrow-right {position: absolute;right: -6px;top: 4px;background: #625e5e;
    width: 40px;height: 40px;border-radius: 30px;line-height: 40px;color: #fff;}
.i_album_b .animated-arrow:hover{background: #625e5e;border: 1px solid #625e5e;color: #fff;}
.i_album_b a:hover i.fa-solid.fa-arrow-right {margin: 0 10px;}

@media screen and (max-width: 1200px){
	/*首頁*/
	.module_i_album section {grid-template-columns: 1fr;}
	.i_album_list{grid-template-columns: repeat(2, 1fr);}
	.i_album_list > li:nth-child(n+4){display: block;}

	.i_album_b{position: relative;justify-content: center;}
	/*相簿列表頁*/
	.show-list .item{margin-bottom: 20px;}

}
@media screen and (max-width: 600px){
	.module_i_album .title_i_box h4{text-align: center;}
}


/*●●●●●●●●●●●●●●●●●●●●●●●●   聯絡我們  ●●●●●●●●●●●●●●●●●●●●●●●●*/
.contact_page .main_part {max-width: 1300px;}
.contact_content{padding: 0;}
.information_left, .information_right{padding: 0;}
.blank_letter {font-family: "Raleway", "Noto Sans TC",serif;font-size: 20px;color: #333;font-weight: 400;}
.contact_content .information_right {padding-left: 6%;}
.contact_form {grid-gap: 15px;}
.contact_form li {grid-template-columns: 1fr;}
.contact_form li .form__label {max-width: inherit;text-align: left;position: relative;font-weight: 500;
	padding-left: 10px;}
.contact_form li .form__insert {font-weight: 300;color: #333;}
.contact_form li input.noborder, .contact_form li textarea.noborder {border: none;outline: none;
    background: #fbfbfb;line-height: 2;border: 1px solid #ddd;padding: 3px 10px;height: 38px;}
.form select{width: 100%;height: 38px;outline: none;border: 1px solid #ddd;}
.contact_form li.last blockquote {color: #b89471;}
.contact_form li.last cite {background: #ba956e;}
.contact_form li.last b{font-weight: 400;}
.contact_form .star{position: absolute;left: -5px;}
.last .animated-arrow {font-size: 12px;background: #595656;border: 1px solid #595656;}
.last .animated-arrow.otherSty {font-size: 12px;color: #555;border: 1px solid #888;background: transparent;}
.last .animated-arrow:hover {letter-spacing: 0;}


@media screen and (max-width: 768px){
	.contact_content .information_right {padding: 80px 0;}
}
 @media screen and (max-width: 600px) {
    .contact_form li .form__label {background: transparent;}
    .last .animated-arrow {width: 150px;}
}



/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */




/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*內頁BANNER 設定*/
.banner {background: transparent;padding: 90px 20px 0;min-height: inherit;position: relative;}
.banner h5 {color: #595353;font-size: 30px;font-family: "Raleway", sans-serif;}
.banner.banA {}
.banner.banB {}
.banner.banC {}
.banner.banD {}
.banner.banE {}
.banner.banblog:before{content: "BLOG";position: absolute;top: 90px;width: 100%;text-align: center;
	color: #595353;font-size: 30px;font-family: "Raleway", sans-serif;font-weight: 700;}
.banner.banblog h5{display: none;}
.banner.banDesign { background-color:#333;}
.album_class_page .banner,.album_info_page .banner{display: none;}

@media screen and (max-width: 768px){
	.banner h5 {font-size: 24px;}
}
/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */