@charset "utf-8";

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

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

*/


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


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


/*上方選單右邊設定 臉書/LINE/電話/信箱
.tp_links a:before {寬高大小設定}
.tp_links a.me_tp_fb {}
.tp_links a.me_tp_fb:before {背景換圖/建議.SVG}
.tp_links a.me_tp_line {}
.tp_links a.me_tp_line:before {背景換圖/建議.SVG}
*/
/* .tp_links a.me_tp_call {display:none !important;}
.tp_links a.me_tp_call:before {背景換圖/建議.SVG}
.tp_links a.me_tp_mail {display:none !important;}
.tp_links a.me_tp_mail:before {背景換圖/建議.SVG} */



/*電腦LOGO
.nav-brand {}
*/
.nav-header {display: inline-block;text-align: center;width: 100%;}
.nav-brand{width: 90px; line-height: 0;}
.nav-brand img {max-width: 100%;width: 100%;}


/*手機LOGO
.nav-brand-m {}
*/



/* = = = 分隔線 = = = = = = = = = == = = = = = = = = = = = = = = == = = */
/*copyright*/
.copy a {color: #FFF;}
/*麵包屑*/
.path {max-width: 1120px;margin: 0 auto;padding: 70px 0 40px 0;}
.path img{display: block;margin: 0 auto;margin-bottom: 5px;}
/*按鈕*/


/*header*/
.main_header_area .container{padding: 10px 10px 13px 10px;}
.header_area {position: relative;width: 100%;}
.main_header_area {background:rgba(255,255,255,1);}
.header_area.sticky {background:#730C02;}
/*主選單*/
.nav-menu {text-align: center;padding-left: 0;}
.align-to-right {float: none;}
.nav-header {position: relative;}
.nav-menu {margin: 0 auto;}
.tp_links{display: none !important;}

.nav-menu > li{position: relative; margin: 0 5px;}
.nav-menu > li:before{content: ''; background: #333333; width: 0; height: 1px; position: absolute; left: 0; bottom: 0; transition: all .4s;}
.nav-menu > li:hover{cursor: pointer;}
.nav-menu > li:hover:before{width: 100%;}
.nav-menu > li > a {margin: 5px; color: #000; letter-spacing: .5px; padding: 5px 10px; font-size: 16px; font-weight: 600; display: inline-block;}


.submenu-indicator-chevron {border-color: transparent #D0D0D0 #D0D0D0 transparent;}
.nav-menu>li:hover>a .submenu-indicator-chevron, .nav-menu>.active>a .submenu-indicator-chevron, .nav-menu>.focus>a .submenu-indicator-chevron {border-color:#D96C6C}
	
/*下拉按鈕*/
.nav-dropdown>li>a{font-size: 14px;}
.nav-dropdown > li > a:hover, .nav-dropdown > li > a:focus { color: #fff; background: #48825A;}

/*購物車*/
.me_tp_features{z-index:999; width: fit-content; right: 0;}
.me_tp_features a{color: #000;}


/*極致餅藝頁面*/
.other_select_page .promotion_title h2 {display: none;}
.other_select_page .promotion_title {display: none;}
.other_select_page .clearfix {display: none;}
.other_select_page .page {display: none;}
/*.other_promotion li a {color: #AF3F3F; font-weight:bold;}
.other_promotion li:hover {border-top: 1px solid #730C02;}*/

/*訂購美味頁面*/
.products-list .pic {padding-bottom: 125%;}
.products-list .name {height: 30px;}
.products-list .more {display:none;}

.product-layer-two li ul {display: none;}
.product-layer-two li a:after {
    position: absolute;
    content: '';
    display: block;
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 20px 10px 0px;
    border-color: transparent transparent transparent transparent !important;
    transform: translateX(-50%) rotate(-90deg);
}

.sidebarBtn {border: none;}
.lastPage {background: #343434; border-radius: 5px; width: 100%; max-width: 195px;}
.ori_price {
    color: #BBBBBB;
    font-size: 16px;
    font-weight: bold;
    text-decoration:line-through;
}
.block {border-radius: 50%;}
.lastaction {background-color: #fff; border: 1px solid #48825A !important; color: #48825A; padding: 0; text-align: center; font-size: var(--font18); border-radius: 5px;}
.nextaction {background-color: #48825A; padding: 0; text-align: center; background-image: none; font-size: var(--font18); border-radius: 5px; border: 1px solid #48825A !important;}

.products-list .pic {padding-bottom:100%;}

/*購物車頁面*/
.rewrite_simple {background: #343434 url(../images/simple_left.png) 10% center no-repeat;color:#FFF;}
.send_simple {background: #48825A url(../images/simple_right.png) 88% center no-repeat;}
.bx-wrapper img { width:100%;}
/*footer*/
.footer {background-color: #343434;}
.footer_logo img{width: 100%; max-width: 140px;}
.footer_info li p,
.footer_info li p a {color: #fff;}
.footer_menu a {color: #fff;background: rgba(255,255,255,0);border-left: 1px solid #FFF; padding: 0 5px; margin: 0 0 10px;}
.footer_menu a:first-child{border-left: none;}
.footer_menu a:last-child{display: none;}
.footer_menu a:hover {background: none; color: #F2C627;}
.footer_info li p.tel:before{content: '手機：';}


/*聯絡我們*/
.noborder {border: 1px solid #d5d5d5; padding: 5px 7px;}
.list_before.info li:last-child {padding-left: 0px;}

/*預設解除背景輪播*/
#content_main {margin:0; background: none;}
.bannerindex {position:static;height:auto;}
.swiper-banner {position:static;margin:0; height:auto;} 
.swiper-slide img {height:auto;}
@media screen and (max-width: 768px) {
.box_search input[type=text]{width: 100%;}
.bannerindex {padding:0; margin:0;}
}


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


/*內頁BANNER 設定*/

.banner h5 {color:#fff;padding-top: 120px;text-shadow: 3px 3px 5px #000;letter-spacing: 3px;display: none;}
.banner.banA {background:url(../images/apf_banner005.jpg) center top;
	background-repeat:no-repeat;height:350px;}
.banner.banB {background:url(../images/apf_banner004.jpg) center top; 
	background-repeat:no-repeat;height: 400px;}
.banner.banC {background:url(../images/apf_banner006.jpg) center top; 
	background-repeat:no-repeat;
	height:350px;}
.banner.banD {background:url(https://pic03.eapple.com.tw/apeipetfood/Paginator-06.png) center top; 
	background-repeat:no-repeat;
	height:300px;}
.banner.banE {}
.banner.banF {background:url(https://pic03.eapple.com.tw/apeipetfood/Paginator-03.png) center top;
	background-repeat:no-repeat;
	height:300px;}
.banner.banblog {}

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


/*文章設定*/
/*一排呈現
.subbox_item { width:100%;}
*/


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


/*相本分類全版面 ( 限制最寬2000px
.work_page .main_part { max-width:2000px;}
.work_page .show_content { padding:0; width:100%;}
.work_page .show-list .item { width:33%; display:inline-block; float:none; margin:0; padding:0;}
@media screen and (max-width: 768px) {
.work_page .show-list .item { width:49%;}
}
@media screen and (max-width: 570px) {
.work_page .show-list .item { width:100%;}
}
.work_page .show-list .item a { max-width:100%;}
.work_page .show-list .show_pic { height:auto; line-height:0;}
.work_page .show-list .show_pic img { max-width:100%; max-height:100%;}
.work_page .show-list .show_name { position:absolute; top:50%; right:10%; width:80%; height:auto; line-height:160%; font-size: 20px; color: #FFFFFF !important; border: solid 1px #fff; text-align: center; margin: -20px 0 0 -120px; padding:5px 20px; transition:all ease-in .3s; opacity:0;}
.work_page .show-list .item:hover .show_name {opacity:1;}
*/


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


/*相本列表
.work_info_page .main_part { max-width:2000px;}
.work_info_page .show_content { padding:0; width:100%;}
.work_info_page .subalbum-menu { text-align:center;}
.work_info_page .subalbum-menu h2 { float:none;}
.work_info_page .pic-list .item { margin:0; padding:10px; width:49%; float:none; display:inline-block;}
@media screen and (max-width: 768px) {
.work_info_page .pic-list .item { width:100%;}
}
.work_info_page .pic-list .show_pic { height:auto; line-height:0;}
.work_info_page .pic-list .show_pic img { max-width:100%; max-height:100%;}
.work_info_page .pic-list .item a { max-width:100%; pointer-events: none; cursor: default; } 取消連結被點擊效果
*/


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


@media screen and (max-width: 1100px){

	.nav-menu > li > a {
	    margin: 5px 2px;
	    padding: 12px 10px;
	}

}

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

/*header*/
.header_area {position: relative; width: auto;background-color: #FFF;}
/*.main_header_area {height:130px;}*/
.nav-header {padding: 10px 10px 0 10px;}

/*logo*/


/*漢堡選單*/
.nav-toggle {right: 0;left: 10px;}
.navigation-portrait .nav-toggle {color: #000;margin-top: 10px;}
.nav-toggle:before {background-color: #000;box-shadow: 0 0.5em 0 0 #000, 0 1em 0 0 #000;}

/*主選單*/
.nav-menu > li > a {color: #000;}

}
@media screen and (max-width: 768px) { 
.fa-2x{
	font-size: unset;
}
}

@media screen and (max-width: 600px) { 
.products-list .item {width:80%; margin: 0 0 10px;}
}


:root{
	--font30: 30px;
	--font22: 22px;
	--font20: 20px;
	--font18: 18px;
	--font16: 16px;
	--font_f: "Cormorant Garamond", serif;
}

.banner,
.product_page .path,
.products-list .item .price span:last-child,
.product_info_page .path{display: none;}

@media screen and (max-width: 768px) {
	:root{
		--font30: 25px;
		--font22: 20px;
		--font20: 19px;
	}
}
@media screen and (max-width: 480px) {
	:root{
		--font30: 22px;
		--font22: 18px;
		--font20: 17px;
		--font18: 16px;
	}
}
@media screen and (max-width: 400px) {
	:root{
		--font30: 20px;
	}
}

/*標題*/
.ba_title{
	text-align: center;
	color: #333333;
	letter-spacing: 1px;
}
.ba_title h5{
	font-size: var(--font30);
}
.ba_title span{
	display: block;
	font-size: var(--font22);
	font-weight: lighter;
	font-family: var(--font_f);
}

/*購物車首頁*/
.main_part01{max-width: 1300px;}
.product_page .show_content{
	padding: 50px 10px 0;
}
.product_page .products-list{
	display: grid;
	grid-template-columns: repeat(4,1fr);
	gap: 30px 10px;
	margin: 0 auto;
}
.product_page .products-list:before{
	display: none;
}
.product_page .products-list .name{
	font-size: var(--font22);
}
.product_page .products-list .price span,
.product_page .products-list .price b{
	font-size: var(--font20);
}
.product_page .products-list .item{
	width: 100%;
	border-radius: 10px;
	margin: 0;
}
.product-layer-two{
	flex-wrap: wrap;
	display: flex;
	justify-content: center;
	align-items: stretch;
	width: 100%;
	max-width: 920px;
	margin: 0 auto 70px;
}
.product-layer-two li{
	width: fit-content;
	min-width: 200px;
	padding: 0;
	margin: 7px 5px;
}
.product-layer-two li a{
	font-size: var(--font16);
	font-weight: normal;
	padding: 10px 20px;
	border: 1px solid #48825A;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
}
.product-layer-two li a:hover{
	background: #48825A;
	color: #fff;
}
.page li{
	background: #48825A;
	border: 1px solid #48825A;
	font-weight: bold;
}
@media screen and (max-width:768px) {
	.product_page .products-list{grid-template-columns: 1fr 1fr 1fr;}
	
}
@media screen and (max-width:600px) {
.product_page .products-list{grid-template-columns: 1fr 1fr;}
.product-layer-two{
	justify-content: space-between;
	margin-bottom: 50px;
}
.product-layer-two li{
	min-width: unset;
	width: calc(100%/2 - 10px);
	margin: 5px 0;
}
}
@media screen and (max-width:450px) {
	.product-layer-two li{width: calc(100%/2 - 5px);}
	.product-layer-two li a{padding: 5px;}
}

/*購物車內頁*/
.product_info_page .main_part{
	max-width: 1300px;
}
.product_pic #bx-pager{
	padding: 0;
	position: relative;
	width: 100%;
}
.product_pic #bx-pager h6{
	display: none;
}
.product_pic #bx-pager a{
	width: 99px;
	height: 99px;
}
.product_pic{
	padding-left: 0px;
}
.ori_price{display: none;}
@media screen and (max-width:600px) {
	.product_main{width: 100%;}
	.product_pic{padding-left: 0;}
	.product_pic #bx-pager a{width: 60px; height: 60px;}
}
@media screen and (max-width:480px) {
	.product_pic #bx-pager a{width: 45px; height: 45px;}
}

/*購物頁面*/
.order_finish_page .path{
	display: none;
}
.pro_fish{
	text-align: center;
}
.pro_fish p{
	font-size: var(--font30);
	margin-top: 10px;
}
.pay_bank_info{
	display: none;
}
.okpay_remind{
	width: 100%;
	max-width: 890px;
	background: #fff;
	padding: 45px 5%;
	margin: 70px auto;
}
.okpay_remind li{
	max-width: 760px;
	margin: 0 auto;
}
.okpay_remind h5{
	text-align: center;
	font-size: var(--font30);
	color: #333333;
	padding-bottom: 15px;
	margin-bottom: 25px;
	border-bottom: 1px solid #DDDDDD;
	letter-spacing: 1px;
}
.okpay_remind dl{
	max-width: 705px;
	margin: 0 auto;
}
.okpay_remind dl dt{
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: var(--font16);
	margin-top: 15px;
}
.okpay_remind dl dt section{
	width: 610px;
	margin-left: 10px;
}
.okpay_remind dl h6{
	color: #A72126;
	font-size: var(--font18);
	font-weight: normal;
	margin-bottom: 5px;
}
.okpay_remind dl span{
	display: inline-block;
}
@media screen and (max-width:480px) {
	.shopping-cart .cell:before{float: unset;}
	.shopping-cart .cart_content .row{margin-left: 0;}
	.shopping-cart .cell.product_name{text-align: left;}
	.small_pic{width: 100%; height: auto; display: block; text-align: center; margin: 15px auto; position: relative;}
	.okpay_remind dl dt{flex-direction: column;}
	.okpay_remind dl dt section{margin: 10px 0; width: 100%; text-align: center;}
}

/*文章*/
.blog_page .main_part{
	max-width: 1300px;
}
.blog_page .path{
	display: none;
}
.blog_page h4.blog_category_title{border-bottom: none;}
h5.blog_le_t{font-family: serif;}

/*文章內頁*/
.blog_in_page .main_part{
	max-width: 1300px;
}
.blog_in_page .path{
	display: none;
}
.blog_back a{
	border: 1px solid #48825A;
	border-radius: 5px;
}
.blog_back a.article_btn_prev,
.blog_back a.article_btn_next{
	background: #fff;
	color: #48825A;
}
.blog_back a.article_btn_back{
	background: #48825A;
	color: #fff;
}
@media screen and (max-width:738px) {
.blog_box{padding: 30px 5%;}
}

/*會員*/
.member_title{
	text-align: center;
	color: #343434;
	padding-bottom: 20px;
	margin: 0 auto 20px;
	border-bottom: 1px solid #343434;
	max-width: 600px;
}
.member_title h5{
	font-size: var(--font30);
	font-weight: normal;
	letter-spacing: 2px;
}
.member_title p{
	font-size: 12px;
	font-weight: lighter;
}
.member_title01{
	border-bottom: none;
}
.member_title01 h5{
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #343434;
	display: flex;
	justify-content: center;
	align-items: center;
}
.member_title01 h5 img{
	margin-right: 10px;
}
.member_title01 p{
	font-size: var(--font20);
	color: #444444;
}
.member_title01 em{
	font-style: normal;
	font-size: 15px;
	margin-top: 10px;
	display: block;
}