@charset "utf-8";

/*預設解除背景輪播*/

.bannerindex { position:relative; height:auto;background: #000;}
.swiper-banner { position:static; margin:0; height:auto;} 

#content {
    background-repeat: repeat;
    background-color: #26293e;}

#content_main {
    width: 100%;
    background: #26293d;
    margin-top: 0;
}

.edit_part {
    padding: 0;
}

.path {display: none;}
/* .swiper-slide img { height:auto;} */

@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0;}
}

/*網站統一設定*/
.main_part {max-width: 1500px;padding: 100px 5%;}
.show_content {padding: 0;}
.page {margin: 50px auto;color: #BB9938;gap: 5px;}
.page li {margin: 0;display: flex;width: 30px;height: 30px;line-height: 30px;
justify-content: center;align-items: center;align-content: center;text-align: center;border-radius: 50px;transition: .3s;}
.page li a, .page li strong {width: 30px;height: 30px;line-height: 30px;color: #BB9938;}
.page strong, .page a:hover {background: #BB9938;color: #000000;}
.page li.activeN {background: #BB9938;color: #000;}

@media screen and (max-width: 1024px) {
.main_part {padding: 80px 5%;}
.page {font-size: 15px;gap: 3px;}
}
@media screen and (max-width: 500px) {
.main_part {padding: 60px 5%;}
.page {font-size: 14px;gap: 2px;}
}
@media screen and (max-width: 425px) {
.main_part {padding: 50px 5%;}
.page {font-size: 13px;gap: 0;}
}

/*網站按鈕*/
.animated-arrow {display: flex;align-items: center;justify-content: center;background: unset;
    margin-top: 50px;margin-right: auto;margin-left: auto; width: 180px; height: 60px;}
.animated-arrow b {font-weight: normal;letter-spacing: 0.08em;}
.animated-arrow:before {content: ""; position: absolute; top: 0; left: 0; display: block; border-radius: 60px; 
    background: #222;z-index: -1; width: 60px; height: 60px; transition: all 0.85s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
.animated-arrow i.fa-solid.fa-arrow-right {color: #ffffff;}
.animated-arrow:hover:before {width: 100%;}
.animated-arrow:active {transform: scale(0.96);}

@media (max-width:600px){
.animated-arrow {width: 165px;height: 45px;margin:30px auto 0;}
.animated-arrow b {font-size: 15px;}
.animated-arrow:before {width: 45px;height: 45px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*HEADER*/
.pageIndex .header_area {background: #26293E;position: fixed;transition: 1s ease;}
.header_area {background: #26293E; padding: 15px;transition: 1s ease;}
.pageIndex .header_area.sticky {background: #28293ee8;transition: 1s ease;}
.header_area.sticky {background: #26293E;transition: 1s ease;}
.me_tp_features {display: none;}
.main_header_area .container {max-width: 90%;}
.navigation {display: grid;grid-template-columns:230px 1fr;align-items: center;}

/*LOGO*/
.nav-header {grid-row: 1 / 1;max-width: 180px;}
.nav-brand {display: flex;}

/*選單*/
.stellarnav > ul > li > a {font-size: 14px; padding: 10px 15px;color: #ffffff;letter-spacing: 0.15em;margin: 0;line-height: 1;height: 30px;}
.stellarnav > ul > li > a:hover b {transform: translateY(-30px);-webkit-transform: translateY(-30px);-moz-transform: translateY(-30px);}
.stellarnav > ul > li > a b {line-height: 1;height: 30px;}
.stellarnav > ul > li.has-sub > a {padding-right: 15px;}
.stellarnav li.has-sub > a:after {display: none;}

/*下拉選單*/
.stellarnav > ul > li > ul {width: 150px;border-radius: 5px;transform: translateX(-50%);left: 50%;right: 0;background: #BB9938;}
.stellarnav > ul > li > ul > li {border: unset;text-align: center;}
.stellarnav > ul > li > ul > li+li {border-top: 1px solid #BB9938;}
.stellarnav > ul > li > ul > li > a {padding: 10px 5px;color: #fff;letter-spacing: 0.1em;transition: 0.2s ease;}
.stellarnav > ul > li > ul > li > a:hover {color: #fff; background: #151724;}
.stellarnav > ul > li > ul > li > ul {background: #BB9938;border-radius: 5px;}
.stellarnav > ul > li > ul > li > ul > li {border: unset;}
.stellarnav > ul > li > ul > li > ul > li+li {border-top: 1px solid #aaa;}
.stellarnav > ul > li > ul > li > ul > li > a {color: #fff;text-align: center;letter-spacing: 0.1em;padding: 10px;}
.stellarnav > ul > li > ul > li > ul > li > a:hover {color: #aaa;}

@media screen and (max-width: 1200px) {
.stellarnav > ul > li > a {padding: 10px;}
.stellarnav > ul > li.has-sub > a {padding-right: 10px;}
}
@media screen and (max-width: 1024px) {
.pageIndex .header_area {background: #26293E;position: sticky;padding: 20px 5% 15px;}
.pageIndex .header_area.sticky {background: #26293E;}
.main_header_area .container {max-width: 100%;}
.navigation {grid-template-columns: 1fr;justify-items: center;gap: 15px;}
.nav-header {max-width: 150px;}
.stellarnav > ul > li > a {font-size: 15px;padding: 10px 5px;}
.stellarnav > ul > li.has-sub > a {padding-right: 5px;}
}
@media screen and (max-width: 768px) {
.pageIndex .header_area {padding: 0 5%;}
.header_area {padding: 0 5%;border-bottom: 1px solid #222;}
.nav-header {max-width: 120px;padding: 20px 0;}

.stellarnav.mobile {display: flex;justify-content: center;align-items: center;height: 100%;}
.stellarnav.mobile .menu-toggle {padding: 0px;}
.stellarnav .menu-toggle span.bars {top: 0;}
.stellarnav .menu-toggle:after {font-size: 10px;letter-spacing: 0.15em;color: #ffffff;transform: unset;}
.stellarnav .menu-toggle span.bars span {width: 33px;height: 1px;background: #666;margin: 0 auto 5px;}
.stellarnav.mobile.right > ul, .stellarnav.mobile.left > ul {border: unset;background: #26293E;max-width: 300px;}
.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {background: #BB9938;color: #fff;letter-spacing: 0.15em;padding: 15px;}
.stellarnav .icon-close {width: 20px;height: 11px;}
.stellarnav .icon-close:before, .stellarnav .icon-close:after {border-bottom: solid 1px #ffffff;}
.stellarnav.mobile > ul > li {border-bottom: unset;}
.stellarnav.mobile li a {border-bottom: unset;}
.stellarnav.mobile > ul > li > a {padding: 20px 30px;font-size: 14px;}
.stellarnav.mobile > ul > li.has-sub > a {padding-right: unset;}
.stellarnav.mobile > ul > li > a.dd-toggle {padding: 20px 15px;}
.stellarnav.mobile ul > li > ul {background: unset;}
.stellarnav.mobile > ul > li > ul > li {text-align: left;}
.stellarnav.mobile > ul > li+li, .stellarnav.mobile > ul > li > ul > li+li {border-top: 1px solid #333;}
.stellarnav > ul > li > ul > li > ul > li+li {border-top: 1px solid #333;}
.stellarnav.mobile > ul > li > ul > li > a, .stellarnav.mobile > ul > li > ul > li.has-sub > a, 
.stellarnav.mobile > ul > li > ul > li > ul > li > a {padding: 15px 30px !important;letter-spacing: 0.15em;text-align: left;}
.stellarnav a.dd-toggle .icon-plus:before, .stellarnav a.dd-toggle .icon-plus:after {border-bottom: solid 1px #fff;}
.stellarnav.mobile li.open {background: #26293E;padding: 0 10px 10px;}
.stellarnav.mobile li.open li.open {background: #26293E;padding: 0;}
.stellarnav.mobile li.open li.open > a {background: #26293E;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

@-webkit-keyframes totop {
	0% {transform: translateY(-20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}
@keyframes totop {
	0% {transform: translateY(-20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}

@-webkit-keyframes tobottom {
	0% {transform: translateY(20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}
@keyframes tobottom {
	0% {transform: translateY(20px);opacity: 0;}
	100% {transform: translateY(0px);opacity: 1;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*內頁BANNER 設定*/
.banner {
    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed;
    min-height: 300px;
    position: relative;
    justify-content: flex-start;
    padding: 424px 60px 122px;
}
.banner.banF {    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed;}
.banner.banE {    background: url(https://pic03.eapple.com.tw/yongyao/bn03.jpg) no-repeat bottom center fixed;}
.banner.banC {    background: url(https://pic03.eapple.com.tw/yongyao/bn02.jpg) no-repeat bottom center fixed;}
.banner.banblog {    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed;}
.blog_page.article_a.bodyDesktop .banner.banblog {    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed;}
.blog_page.article_b.bodyDesktop .banner.banblog {    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed;}
.banner[data-banner=news_a_list_2251] {
    background: url(https://pic03.eapple.com.tw/yongyao/bn01.jpg) no-repeat bottom center fixed !important;
}

.banner:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #08112c47;
}
.banner:after {
    content: "YONG YAO DESIGN";
    display: block;
    text-align: justify;
    word-break: break-all;
    color: #fff;
    font-style: normal;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    z-index: 1;
    position: absolute;
    left: 225px;
    bottom: 14%;
    letter-spacing: 1px;
}

.banner h5 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    text-align: left;
    padding-left: 160px;
    position: relative;
}

.banner h5::after {
    content: "";
    display: block;
    color: #fff;
    font-style: normal;
    font-size: 60px;
    font-weight: 400;
    font-family: 'Playfair Display', sans-serif;
    line-height: 100%;
    text-transform: uppercase;
}

.banner.banF h5:after {   content: "SERVICE";}
.banner.banE h5:after {   content: "PROJECT";}
.banner.banC h5:after {   content: "CONTACT";}
.banner.banblog h5:after {   content: "Curtain";}
.blog_page.article_a.bodyDesktop .banner.banblog h5:after {   content: "ARTICLE";}
.banner[data-banner=news_a_list_2251] h5:after { content: "recommend";}

@media screen and (max-width: 768px) {
    .banner {
        padding: 125px 45px 58px;
        background-attachment: initial;
        background-size: cover;
    }
    .banner:after {
        bottom: 10%;
        font-size: 12px;
        left: 48px;
    }

    .banner h5 {
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        text-align: left;
        padding-left: 0px;
        position: relative;
    }
    .banner h5::after {
        font-size: 45px;
    }
    
}


/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*FOOTER*/
.footer {padding: 50px 0 0;background: #26293E;}
.footer .center {max-width: 90%;}
.footer_info {grid-template-columns: repeat(2, 1fr);padding-right: 0;grid-gap: 0;row-gap: 30px;}
.footer_info ul {display: flex;grid-column: span2 / 1;justify-content: space-between;}
.footer_info li {padding: 10px 0 0;}
.footer_info li p {
    letter-spacing: 0.1em;
    color: #ffffff;
    font-size: 14px;
}
.footer_info li p a {color: #fff;}

.footer_menu {display: flex;flex-wrap: wrap;}
.footer_menu a:nth-child(1) {display: none;}
.footer_menu a {display: inline-block;padding: 0 0 0 15px;border: unset;margin: 0 0 5px 0;
    letter-spacing: 0.1em;font-size: 14px;line-height: 100%;color: #999;background: unset;transition: 0.5s ease;}
.footer_menu a:hover {background: unset;color: #BB9938;text-decoration: underline;transition: 0.5s ease;}

.footer_logo {max-width:170px;}
.box_link {position: relative;max-width: 100%;justify-content: flex-end;flex-direction: row;gap: 10px;display: none;}
.box_link a {display: block;width: 30px;border: unset;border-radius: 0;padding: 0;font-size: 18px;text-align: right;margin: 0;transition: 0.5s ease;}
.box_link a:hover {opacity: 0.5;}

/*COPY*/
.copy {
    max-width: 90%;
    margin: auto;
    text-align: center;
    padding: 15px 0;
    font-size: 13px;
    color: #ffffff;
    border-top: 1px #ffffff36 solid;
    margin-top: 50px;
}
.copy a {font-size: 13px;color: #ffffff;padding: 0 5px;}

/*TOP*/
#to_top {bottom: 20px;right: 0px;left: auto;width: 45px;height: 45px;padding-top: 8px;letter-spacing: 0.1em;
    color: #ffffff;background: #666;box-shadow: unset;border-radius: 0px;border-radius: 5px;}
#to_top i.top {height: 15px;}
#to_top i:before, #to_top i:after {background: #ffffff;}
#to_top i.top:before, #to_top i.top:after {height: 10px;}

@media screen and (max-width: 1024px) {
.footer_info {grid-template-columns: 1fr;}
.footer_info ul {flex-direction: column;row-gap: 30px;padding-bottom: 50px;}
.footer_menu a {padding: 0 15px 0 0;font-size: 13px;}
}
@media screen and (max-width: 768px) {
.footer_info {padding: 0;row-gap: 20px;}
.footer_info ul {padding-bottom: 30px;}
.footer_info li {padding: 0;}
.footer_info li+li {margin-top: 0;}
.footer_info li p {font-size: 14px;}
#to_top {right: 10px;width: 40px;height: 40px;}
#to_top i.top {height: 12px;}
#to_top i.top:before, #to_top i.top:after {height: 8px;}
}
@media screen and (max-width: 600px) {
.footer_info {padding: 0;}
.footer_info li p {font-size: 13px;}
.box_link {align-items: flex-start;}
.box_link a {width: 25px;font-size: 17px;}
.footer_menu a {min-width: 100px;padding: 0 15px 5px 0;}
.total_view {display: inline-block;}
}
@media screen and (max-width: 450px) {
.footer_menu a {min-width: 90px;font-size: 12px;}
}
@media screen and (max-width: 375px) {
.footer_info ul {row-gap: 20px;padding-bottom: 50px;}
.footer_info li p {letter-spacing: 0.12em;}
.footer_menu a {min-width: 70px;font-size: 11px;padding: 0 0px 8px 0;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*●●●●●●●●●●●●●●●●●●●●●●●●   文章分類管理   ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*※※※※※【【  固定區塊不動↓↓↓  】】※※※※※*/
/*側邊*/
.blog_le{padding: 0 7px;}
h5.blog_le_t{text-align: center;margin-bottom: 0;}
h5.blog_le_t em,h5.blog_le_t span{display: none;}
.blog_search input[type=search]{border-radius: 0;}
.blog_le .accordion {border-radius: 0;}
.accordion li .link a {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .3rem;
    text-align: center;
}
.submenu a {padding: 12px 12px 12px 30px;background: #fff;font-size: 12px;}
/*分類頁*/
.blog_ri {padding: 0 0 0 50px;}
.blog_page h4.blog_category_title{display: none;}
.blog_subbox {grid-template-columns: 1fr;}
.subbox_item a {grid-template-columns: 200px 1fr;align-items: center;grid-gap: 50px;padding-right: 50px;}
.subbox_item a:before {font-size: 12px;padding: 5px 20px;background: #c1a383;color: #fff;
	bottom: auto;right: auto;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.subbox_item a:after {background: rgba(256,256,256,.5);border: none;}
.blog_list_ri h5 {color: #444;font-weight: 400;}
.blog_list_ri em {font-size: 12px;}
.blog_list_ri p {font-weight: 400;letter-spacing: .2rem;line-height: 160%;font-size: 12px;margin-top: 20px;}
/*文章頁*/
h4.blog_category_title {padding: 0;font-size: 20px;letter-spacing: .4rem;margin-bottom: 0;font-weight: 400;}
.blog_shareData{border-bottom: 1px solid #eee;padding-bottom: 10px;}
.toShareNews b{font-size: 12px;font-weight: 400;}
.toShareNews a object{max-width: 20px;}
.articel_mainPic{display: none;}/*清單縮圖*/
.blog_back {grid-gap: 0;}
.blog_back a.article_btn_prev,.blog_back a.article_btn_next {
	background: transparent;color: #bbbbbb;border: 1px solid #bbbbbb;font-size: 14px;padding: 12px;}
.blog_back a.article_btn_back{background: #BA9938;padding: 12px;}
.news_related{padding: 50px 0 25px;border-top: 1px solid #26293d;margin-top: 100px; background: #26293d;}
.news_related h6 span:before {font-size: 18px;letter-spacing: .6rem;font-weight: 500;color: #555;}
.news_related_list {background: transparent;}
.news_related_list li a{padding: 0;}
.news_related_list li a p {font-size: 14px;width: 90%;line-height: 1.4;margin: 10px auto 20px;padding: 0;}
.lastPage {background: #26293d;font-size: 16px;}

@media screen and (max-width: 1024px){
	/*分類頁*/
	.subbox_item a {grid-template-columns: 120px 1fr;align-items: start; grid-gap: 30px;padding: 15px 0;}
}
@media screen and (max-width: 768px){
	/*側邊*/
	.blog_le{padding: 0;}
	/*分類頁*/
	.blog_list_ri{padding: 0;}
	.blog_list_ri h5 {font-size: 16px;}
	/*文章頁*/
	.blog_le, .blog_ri{margin-bottom: 50px;}
	.blog_back a.article_btn_prev,.blog_back a.article_btn_next,.blog_back a.article_btn_back{font-size: 12px;}
	.lastPage{font-size: 12px;}
}
@media screen and (max-width: 450px){
	/*分類頁*/
	.subbox_item a {grid-template-columns: 80px 1fr;grid-gap: 15px;}
}
/*※※※※※【【  此案件更動處↓↓↓  】】※※※※※*/
/*側邊*/
.blog_le .accordion li .link{transition: all .5s;}
.accordion li .link a {color: #fff;}
.blog_le .accordion li .link i {color: #fff;}
.submenu li.on_this_category a, .submenu a:hover {background: linear-gradient(45deg, #bb9938, #978546, #c3ad60);}
/*分類頁*/
.subbox_item a {grid-template-columns: 230px 1fr;}
.subbox_item a:before {background: #bb9938;color: #333;line-height: 1;padding: 8px 20px;font-weight: 500;
    font-family: "Oswald", sans-serif;}
.subbox_item a:after {background: rgb(44 44 44 / 50%);}
.blog_list_ri h5 {color: #fff;}
.blog_list_ri em {color: #bb9938;}
.blog_list_ri p{color: #ccc;}
/*文章頁*/
h4.blog_category_title{color: #fff;}
.toShareNews b{color: #ccc;}
.blog_box_edit * {color: #eee;}
.news_related h6 span:before{color: #eee;}
.news_related_list li a {background: transparent;}
.news_related_list li a p{color: #ccc;}
.blog_shareData .visitors_num {font-size: 12px;color: #ccc;}
/*首頁*/
.module_i_news {padding: 80px 20px;}
.module_i_news section {max-width: 1400px;}
.module_i_news .title_i_box {margin-bottom: 10px;}
.module_i_news .title_i_box h6 {
    font-family: "Playfair Display", sans-serif;
    font-size: 2vw;
    color: #b99843;
    font-weight: 300;
    letter-spacing: 0.1em;
}

.module_i_news .title_i_box h4 {
    font-size: 20px;
    color: #dbdbdb;
    letter-spacing: .3rem;
    font-family: "Noto Serif TC", sans-serif;
}
.module_i_news ul {grid-template-columns: 1fr 1fr 1fr 1fr;}
.module_i_news li a {grid-template-columns: 1fr;}
.module_i_news li a:before,.module_i_news li a:after{display: none;}
.i_blog_ri h5{color: #fff;}
.i_blog_ri em{color: #b99843;}
.i_blog_ri p{color: #ccc;font-size: 12px;}
.i_blog_le {overflow: hidden;}
.module_i_news li a .i_blog_le img{transform: scale(1);transition: all .5s;}
.module_i_news li a:hover .i_blog_le img{transform: scale(1.05);}

@media screen and (max-width: 1024px){
	/*首頁*/
	.module_i_news ul {grid-template-columns: 1fr 1fr;}
}
@media screen and (max-width: 960px) {
    .subbox_item {border-bottom: none;}
}
@media screen and (max-width: 768px){
	/*右側*/
	.blog_ri {padding: 0;}
	/*首頁*/
	.module_i_news .title_i_box h6:before{font-size: 42px;}
	.module_i_news li {border-bottom: none;}
}
@media screen and (max-width: 500px){
	/*分類頁*/
	.subbox_item a {grid-template-columns: 1fr;}
	/*首頁*/
	.module_i_news {padding: 50px 20px;}
	.module_i_news ul {grid-template-columns: 1fr;}
}



/*●●●●●●●●●●●●●●●●●●●●●●●●   相簿管理(有分類)   ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*※※※※※【【  固定區塊不動↓↓↓  】】※※※※※*/
/*分類頁面*/
.overlay {-webkit-transform: scale(1);transform: scale(1);background: rgb(85 85 85 / 50%);}
.show-list {grid-template-columns: repeat(3, 1fr);}
.show-list .item a{position: relative;}
.show-list .item a:before{content: "VIEW   +";position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);
border-bottom: 2px solid #ccc;font-size: 12px;max-width: 100px;color: #fff;height: 0;overflow: hidden;opacity: 0;
transition: all .5s;transition-delay: 0s;}
.show-list .item a:hover:before{opacity: 1;height: 25px;padding-bottom: 10px;transition: all .5s;
	transition-delay: .3s;z-index: 100;}
.show-list .show_name {font-weight: 400;text-align: center;color: #888;letter-spacing: .6rem;font-size: 14px;}
.show-list .item:hover .show_name {color: #fff;}
/*相簿頁面*/
.subalbum-menu{padding: 0;}
.subalbum-menu h2 {font-size: 14px;font-weight: 400;background: #BB9938;color: #fff;padding: 8px 20px;
    line-height: 1.2;border-radius: 5px;letter-spacing: .4rem;}
.other_subalbum li a p {background: rgb(85 85 85 / 20%);color: #fff;text-align: center;font-weight: 300;
    font-size: 14px;padding: 10px;letter-spacing: .6rem;position: absolute;bottom: 0;left: 0;width: 100%;
height: 100%;display: flex;justify-content: center;align-items: end;padding-bottom: 30px;}
/*相本頁面*/
.album_descrip p{font-size: 14px;line-height: 180%;}
/*首頁*/
.module_i_album .title_i_box {margin-bottom: 10px;}
.module_i_album .title_i_box h4 {font-size: 20px;letter-spacing: .6rem;margin-top: 10px;}
.module_i_album section {max-width: 1600px;}
.i_album_list {grid-template-columns: repeat(3, 1fr);}
.i_album_list li a p {height: 60px;background: rgb(85 85 85 / 50%);color: #fff;padding: 10px;font-size: 14px;}
.i_album_list li a p span {font-size: 14px;letter-spacing: .4rem;font-weight: 300;width: 100%;padding-left: 20px;text-align: left;}
.i_album_list li a p span:after{content: "VIEW   +";display: block;border-bottom: 2px solid #ccc;font-size: 12px;max-width: 100px;
height: 0;overflow: hidden;opacity: 0;transition: all .5s;transition-delay: 0s;}
.i_album_list li a:hover p span{font-size: 18px;}
.i_album_list li a:hover p span:after{opacity: 1;height: 25px;margin-top: 20px;padding-bottom: 10px;transition-delay: .3s;}


/*相片頁*/
.pic-list {column-count: 3;display: block;}
.pic-list .item{padding: 1%;width: 100%;}
.other_album_choice li {background: #757575;}
.pic-list .show_pic {
    overflow: inherit;
    height: auto;
    padding-bottom: 0;
    aspect-ratio: auto;
    margin-bottom: 15px;
}
.album_info_page .pic-list .item h6 {
    padding: 10px;
    display: none;
}

/*※※※※※【【  此案件更動處↓↓↓  】】※※※※※*/
/*首頁*/
.module_i_album {padding: 80px 20px 0;background: #151724;}
.module_i_album .title_i_box {display: flex;flex-direction: column-reverse;}
.module_i_album .title_i_box h6 {
    color: #dbdbdb;
    font-size: 16px;
    letter-spacing: .2rem;
    font-weight: 500;
    font-family: "Playfair Display", sans-serif;
}
.module_i_album .title_i_box h4 {
    font-size: 30px;
    color: #bb9938;
    letter-spacing: .2rem;
    font-family: "Noto Sans", "Noto Serif TC", sans-serif;
}
.i_album_list li div {aspect-ratio: 2 / 1;}
.i_album_list li img {filter: grayscale(1);transition: all .5s;}
.i_album_list li a {border-radius: 15px;overflow: hidden;}
.i_album_list li:hover img{filter: grayscale(.3);}
.i_album_list li a p {background: rgb(114 105 97 / 60%);}
.animated-arrow {background: #bb9938;}
.i_album_b {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    margin: 10px 0 30px 0;
}

/*大分類*/
.show_content{padding: 0;}
.show-list .show_pic {aspect-ratio: 4 / 3;}
.album_class_page .main_part {
    max-width: 1800px;
    padding: 100px 1%;
}

/*相簿頁*/
.other_subalbum li a p{letter-spacing: .4rem;}
/*相片頁*/
.other_album {margin: 50px 0 80px;}
.album_fixed_title{background: transparent;}
.other_album_choice li {background: #bb9938;border-radius: 0;}
.other_album_choice li a {font-size: 12px;}
.fa-right-from-bracket::before {content: "\f061";}


@media screen and (max-width: 768px){
	/*主分類*/
	.show-list .item {width: 100%;}
	.show-list .show_pic img{min-height: 35vw;}
	/*次分類*/
	.other_subalbum li{width: 48%;}
	.other_subalbum li img{min-height: 35vw;}
	/*相片頁*/
	.pic-list .item {width: 100%;}
	.pic-list .show_pic img {min-height: 35vw;}
    .pic-list {column-count: 2;}

    .i_album_list {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 10px;}
}

@media screen and (max-width: 450px) { 
	/*相簿*/
	.show-list .show_pic img{min-height: 140px;}
	.other_subalbum li img{min-height: 140px;}
	.pic-list .show_pic img {min-height: 140px;}
}

@media screen and (max-width: 1024px){
	/*分類頁面*/
	.show-list {grid-template-columns: repeat(2, 1fr);}
	/*首頁*/
	.i_album_list {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 500px){
	/*分類頁面*/
	.show-list {grid-template-columns: repeat(2, 1fr);}
	/*首頁*/
	.i_album_list {grid-template-columns: repeat(1, 1fr);}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*購物車-作品*/
.product_page .main_part {max-width: 90%;}
.product_menu_list {margin-bottom: 100px;}
.product_menu_list ul {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
.product-layer-two li a {border: unset;background: unset;padding: 10px 30px;font-size: 17px;line-height: 1;
    color: #ffffff; letter-spacing: 0.15em;transition: 0.5s ease;}
.product-layer-two li a:hover {color: #999;transition: 0.5s ease;}
.product-layer-two li i {display: none;}
.product-layer-two li.active a {font-weight: normal;border: unset;color: #ffffff;background: #21212180;}
.product-layer-two li ul { display: none !important;}
.product-layer-two li+li {border-left: 1px solid #666;}

.products-list {grid-template-columns: repeat(3, 1fr);}
.products-list .item a {padding-bottom: 0;transition: 0.5s ease;}
.products-list .item a:hover {opacity: 0.5;transition: 0.5s ease;}
.products-list .pic {aspect-ratio: 3 / 2;}
.products-list .name {text-align: center;font-size: 15px;color: #ffffff;letter-spacing: 0.08em;margin-top: 20px;-webkit-line-clamp: 1;}
.products-list .more {display: none;}

@media screen and (max-width: 1400px) {
.product_menu_list {margin-bottom: 80px;}
}
@media screen and (max-width: 1024px) {
.product-layer-two li a {padding: 8px 30px;font-size: 16px;text-align: center}
.products-list {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 900px) {
.product-layer-two li {margin: 0 0 10px;width: 50%;}
.product-layer-two li:nth-of-type(2n) {border-left: 1px solid #666;}
.product-layer-two li+li {border-left: unset;}
}
@media screen and (max-width: 768px) {
.product_page .main_part {max-width: 100%;}
.product_menu_list { margin-bottom: 50px;}
.product-layer-two li a {font-size: 14px;}
.products-list .name {margin-top: 15px;}
}
@media screen and (max-width: 600px) {
.product_menu_list ul {row-gap: 10px;}
.product-layer-two li {width: 50%;margin: 0;}
.product-layer-two li:nth-of-type(2n+1) {border-left: unset;}
.products-list .name {font-size: 14px;}
}
@media screen and (max-width: 500px) {
.products-list {grid-template-columns: repeat(1, 1fr);}
.product_menu_list ul {row-gap: 15px;}
.product-layer-two li a {padding: 5px 10px;}
}

/*作品內頁*/
.product_info_page .main_part {max-width: 1200px;}
.product_info_page .product_menu_list, .product_info_page .product-wrapper .product_main, .sidebarBtn form, .sidebarBtn .toShare, 
.pd_tabTitle li, .pd_tabTitle {display: none;}
.sidebarBtn {border: unset;width: 100%;padding: 50px 0;background: unset;text-align: center;}
.sidebarBtn h2 {color: #ffffff;font-size: 22px;font-weight: normal;letter-spacing: 0.15em;}
.prod_tabs {margin-top: 0;border-top: 1px solid #222;padding-top: 50px;}
.pd_tabInner_contain {padding-top: 0;}
.pd_tabInner_contain .edit {padding: 0;color: #fff;letter-spacing: 0.08em;line-height: 1.8;font-size: 15px;}
.pd_tabInner_contain .edit strong {line-height: 2;font-size: 16px;}

.prod_related { background: unset;padding: 0 0 100px;}
.prod_related h6, .related_list {display: none;}
.lastPage {
    font-size: 15px;
    letter-spacing: 0.2em;
    color: #fff;
    background: #26293d;
    border-bottom: 1px solid #e5a111;
    padding: 15px 20px;
    width: 100%;
    max-width: 300px;
    transition: 0.5s ease;
    margin: auto;
}
.lastPage:hover {background: #e5a111;color: #000;}

@media screen and (max-width: 1024px) {
.sidebarBtn h2 {font-size: 20px;}
}
@media screen and (max-width: 768px) {
.sidebarBtn {margin: 0;padding: 0 0 50px;}
.prod_related {padding: 0 0 80px;}
}
@media screen and (max-width: 600px) {
.sidebarBtn {padding: 0 0 30px;}
.sidebarBtn h2 {font-size: 18px;}
.prod_tabs {padding-top: 35px;}
.pd_tabInner_contain .edit {font-size: 14px;}
.lastPage {font-size: 14px;}
}
@media screen and (max-width: 500px) {
.sidebarBtn h2 {font-size: 17px;}
.pd_tabInner_contain .edit {font-size: 13px;}
.pd_tabInner_contain .edit strong {font-size: 14px;}
.lastPage {font-size: 13px;}
}
@media screen and (max-width: 425px) {
.prod_related {padding: 0 0 60px;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*聯絡我們*/
.contact_page .main_part {max-width: 1000px;width: 90%;}
.contact_content {padding: 0 0 100px;}
.contact_content form {display: flex;flex-direction: column;align-items: center;gap: 80px;}
.contact_content .information_left, .contact_content .information_right {width: 100%;padding: 0;}
.blank_letter, .list_before {display: none;}

.contact_form {display: flex;flex-wrap: wrap;justify-content: space-between;gap: 30px;
    margin-top: 0;margin-bottom: 0;font-size: 16px;color: #ffffff;}
.contact_form li {grid-template-columns: 125px 1fr;width: 100%;padding-left: 0;}
.contact_form li:nth-last-of-type(2), .contact_form li:nth-last-of-type(3){width: 100%;max-width: 100%;}
.contact_form li .form__label {max-width: 150px;font-size: 16px;
    display: flex;width: 100%;text-align: right;margin-left: 0;letter-spacing: 0.08em;
    padding-right: 0;vertical-align: top;flex-direction: row-reverse;justify-content: flex-end;}
.contact_form li:has(input[type=checkbox]) .form__insert, .contact_form li:has(input[type=radio]) .form__insert {
    grid-template-columns: 30px 1fr;grid-gap: 10px 5px;}
.contact_form li input.noborder, .contact_form li textarea.noborder {width: 100%;
    border: 0;padding: 10px;background: #f5f5f50d;color: #ffffff;letter-spacing: 0.08em;}
.form select {color: #ffffff;letter-spacing: 0.08em;width: 100%;padding: 9px 30px 7px 10px;margin-right: 0;margin-bottom: 0;}

.contact_form li.last {
    width: 100%;max-width: 600px;margin: 0 auto;display: flex;border: none;text-align: right;margin-top: 80px;
    padding: 0;justify-content: space-between;}
.contact_form li.last blockquote, .contact_form li.last cite {width: 48%;max-width: unset;
    position: relative;background: unset;color: #fff;border: 0;text-align: center;
    padding: 0;border-radius: 0;line-height: 50px;transition: 0.5s;border-bottom: 1px solid #e5a111;}
.contact_form li.last cite i {display: none;}
.contact_form li.last blockquote:hover, .contact_form li.last cite:hover {background: #41465ebd;}
.contact_form li.last blockquote:hover input, .contact_form li.last cite:hover input {letter-spacing: 0.15em;color: #e5a111;}
.contact_form li.last input {font-size: 16px;letter-spacing: 0.15em;color: #fff;padding: 0;position: relative;z-index: 1;}
.contact_le_map a {
    display: block;
    background: #BB9938;
    text-align: center;
    padding: 10px;
    color: #fff;
}

.contact_page .box {
    border: none;
    margin: 8% auto 0 auto;
}


@media screen and (max-width: 1024px) {
.contact_content {padding: 0 0 80px;}
.contact_content form {gap: 80px;}
.contact_form li.last {margin-top: 30px;}
}
@media screen and (max-width: 768px) {
.contact_content {padding: 0 0 60px;}
.contact_content form {gap: 50px;}
.contact_form li {width: 100%;}
.contact_form li .form__label {font-size: 15px;}
}
@media screen and (max-width: 600px) {
.contact_form {gap: 20px;}
.contact_form li {grid-template-columns: 1fr;grid-gap: 5px;}
.contact_form li .form__label {font-weight: normal;padding: 0;background: unset;font-size: 14px;}
.contact_form li:has(input[type=checkbox]) .form__insert, .contact_form li:has(input[type=radio]) .form__insert {font-size: 14px;}
}
@media screen and (max-width: 400px) {
.contact_form li .form__label {font-size: 13px;}
.contact_form li.last {margin-top: 15px;}
.contact_form li.last input {font-size: 13px;padding: 0;letter-spacing: 0.05em;}
}

/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */
#bottom_menu {display: none;}
}




