@charset "utf-8";

/*
關於CSS設定說明
CSS屬性是會繼承的，而且還是由上往下繼承。
同樣元素設定16px 後 12px 再 15px 最後會以最後設定的15px為準
但是有兩種情況除外:
1.絕對路徑命名. 如: .xx .yy .zz p {設定值;}
2.important.  如: .xx p {設定值 !important;}

CSS3選取器語法 :nth-child(n) 

*/

.album_page #content, .album_info_page #content, .promotions_page #content {min-height: 80vh;}

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


.pageIndex .nav-brand{
	width: 100%;
}

.header_area.sticky .nav-brand, .nav-brand{
	width: 135px;
	transition: all .5s;
}



/*上方選單解除滑動固定
.header_area.sticky { position:relative;}
*/

.pageIndex .header_area {position: fixed;width: 100%;}
.pageIndex .main_header_area {background: linear-gradient(180deg, #000,transparent);transition: all .5s;}
.header_area.sticky .main_header_area, .main_header_area{background: rgb(129 203 197 / 90%);}
.pageIndex .main_header_area .container {max-width: 1400px;transition: all .5s;}
.header_area.sticky .main_header_area .container, .main_header_area .container {max-width: 1600px;transition: all .5s;}

.pageIndex .nav-brand img {filter: drop-shadow(0px 0px 3px black);}
.header_area.sticky .nav-brand img, .header_area.sticky .nav-menu > li > a, .nav-menu > li > a {filter:none;}

.header_area.sticky .nav-menu, .nav-menu { margin: 5px 0 0 0;transition: all .5s;}
.pageIndex .nav-menu { margin: 70px 0 0 0;transition: all .5s;}
.header_area.sticky .nav-menu > li > a, .nav-menu > li > a {
	color: #fff;
    padding: 45px 20px;
    letter-spacing: 2px;
    font-weight:550;
	transition: all .5s;}
.pageIndex .nav-menu > li > a {filter: drop-shadow(0px 0px 5px black);padding: 10px 20px;}

.nav-menu>li>a .submenu-indicator-chevron, .nav-menu>.active>a .submenu-indicator-chevron, .nav-menu>.focus>a .submenu-indicator-chevron 
{display:none;}
.nav-menu>li:hover>a, .nav-menu>li.active>a, .nav-menu>li.focus>a,
.header_area.sticky .nav-menu>li:hover>a, .header_area.sticky .nav-menu>li.active>a, .header_area.sticky .nav-menu>li.focus>a
{letter-spacing: 6px;transition: all .5s;color:#fff;}
.pageIndex .nav-menu>li:hover>a, .pageIndex .nav-menu>li.active>a, .pageIndex .nav-menu>li.focus>a{
color:#fff;}

.nav-menu > li > a:before {
	content: "";
	background-image: url(https://pic03.eapple.com.tw/rosecattery/icon.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
	height: 22px;
	width: 22px;
	position: relative;
	top:4px;
	right:8px;
	transition: all .4s;
}

.nav-menu > li:not(.tp_links)> a:hover:before {right:12px;transform: scale(1.2);transition: all .4s;}

.header_area.sticky .nav-dropdown > li > a, .nav-dropdown > li > a {color: #fff;background:#81cbc5;}
.header_area.sticky .nav-dropdown > li > a:hover, .header_area.sticky .nav-dropdown > li > a:focus, 
.nav-dropdown > li > a:hover, .nav-dropdown > li > a:focus
{color:#666; background: #fbeab7;font-weight: 550;}

.nav-dropdown > li > a {border-bottom:1px #fff solid;}


.tp_links{display: none !important;}


.pageIndex .nav-dropdown > li > a {color: #fff;background: rgb(0 0 0 / 50%);}
.pageIndex .nav-dropdown {background:transparent;border:none;}
.pageIndex .nav-menu>li>.nav-dropdown {border: none;}
.header_area.sticky .nav-menu>li>.nav-dropdown {border: 1px #fff solid;}
.pageIndex .nav-dropdown > li > a:hover, .pageIndex .nav-dropdown > li > a:focus
{color:#666; background: #fbeab7;font-weight: 550;}

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


/*預設解除背景輪播*/
#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;}
}


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


/*內頁BANNER 設定*/
.banner {display: none;}
.path {display: none;}

.contact_page #content, .map_page #content, .promotions_page #content, .album_page #content, .album_info_page #content{
    width: 100%;
    background:no-repeat;
    background-image: url(https://pic03.eapple.com.tw/rosecattery/bg.jpg);
	background-attachment:fixed;
	background-size: cover;
	background-position: center;}

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


/*促銷設定*/
.promotion_title { border-bottom: 1px solid #627f95;}
.promotion_title h2 {border-bottom: 2px solid #627f95;}


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


/*相簿設定*/
.album_fixed_title {background: transparent;}
.other_album:before { width: calc(100% - 240px); right: 0;}
.other_album_choice li {background: #627f95;}
.show-list .item:hover .show_name { color: #627f95;}
.show-list .item {padding: 0 5px;margin: 20px 0.5%;}
.show-list .show_pic { width:100%; height:100%; line-height:0;padding-bottom: 0;}
.show-list .show_pic img {
    width: 100%;
    height: 100%;
    object-fit:cover;
	aspect-ratio: 4/3;}

.pic-list .show_pic {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 4/3;
	padding-bottom: 80%;
}
.pic-list .show_pic img {
	position:absolute;
	top:0;
	bottom:0;
	left: 0;
	right: 0;
	margin: auto;
	width: 100%;
    height: 100%;
    object-fit:cover;}
	
.other_subalbum li a {
    line-height: 0;
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 1/1;
    padding-bottom: 80%;
}
.other_subalbum li a img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


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


/*聯絡我們*/
.FAX:before {content: "LINE ID";}
.list_before.info li {padding-left: 50px;}
.list_before.info li:before {width: 40px;}
.list_before.info li:last-child {padding-left: 0px;}
.animated-arrow { background: #627f95;}

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

/*footer*/
.footer {
    padding-top: 30px;
    border-top: 1px solid #eee;
    background: #fff;
}
.footer_logo { display: none;}

.footer_info { padding: 0; text-align: center;}
.footer_info li:nth-child(1) {  width: 100%;}
.footer_info li:nth-child(2) {  width: 100%;}
.footer_info li p {  display: inline-block;  margin: 5px 20px;}
.footer_info ul {width: calc(100% - 100px);}

.footer_info li p.fax:before {content: 'LINE ID：';}

.footer_menu a {
    border: none;
    background:none;
	text-align: center;
    font-size: 13px;
    letter-spacing: 1px;
	transition: all .5s;
}
.footer_menu a:hover {
	color: #bbb;
	background: none; 
	border: none;
}

.footer_menu::before {
    content: "";
    display: block;
    height: 1px;
    margin: 10px auto;
    background-color: #ccc;
}
.footer_info li p.tel2:before{
    content: '手機：';
}

.TEL2:before{
    content: '手機';
}
.copy {color: #fff; background:#81cbc5;margin-top:15px;border-top:none;}
.copy a {color: #fff;}
.copy a:hover { color: #19506e;}

.box_link {display: none;}

@media screen and (max-width: 768px) {
/* 開啟手機板下方按鈕所需設定 */
#bottom_menu {display: block; }
.footer.with_shopping_mode { padding:30px 0 70px; }
#to_top { bottom:60px;}


.header_area {position: relative!important;}
.main_header_area {background:#81cbc5!important;}
.nav-brand img {filter: none!important;}
.nav-brand{width: 30%!important;}
.nav-header{margin-bottom:-8px;}
.nav-menu {margin: 5px 0 0 0!important;}
.nav-menu > li > a, .nav-menu>li:hover>a, .nav-menu>li.active>a, .nav-menu>li.focus>a {filter: none!important; color:#81cbc5!important;letter-spacing: 2px;padding: 10px 20px!important;}
.nav-dropdown > li > a, .nav-dropdown > li > a:hover, .pageIndex .nav-dropdown > li > a:focus {
    color: #999!important;
    background: #fff!important;
}
.nav-dropdown > li > a, .megamenu-list > li > a {
    width: 100%;
}
}

@media screen and (max-width: 400px) { 
.footer_info ul {
    width: calc(100% - 30px);
    text-align: left;
}
}


@media screen and (max-width: 768px) {
/* 大圖調整 */
.swiper-slide img {
    animation-fill-mode: none;
    -webkit-animation-fill-mode: none;}

/* 新版最新消息內頁 */
.blog_back {display: flex; justify-content: space-between; align-items: center; align-content: center;}
.blog_back a {width:31.5%;}
}