@charset "utf-8";

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

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

*/

/*引入字體*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lilita+One&display=swap');


/*字型更換*/
.navigation, .stellarnav > ul > li > a b,
.footer_info ul,
#content_main,
.product-layer-two, .products-list, .product-wrapper, .prod_related, .pd_lightbox_box,
.blog_box, .news_related, h5.blog_le_t,
body.promotions_page .main_part,.news_part,
body.album_page .show_content, body.album_class_page .show_content, body.album_info_page .show_content,
.contact_editbox, .contact_content, .blank_letter,
.animated-arrow b {
  	font-family: "Noto Sans", "Noto Sans TC", sans-serif;
	font-weight: 400;
	letter-spacing: 1px;
  	font-style: normal;
  	font-optical-sizing: auto;
}

/*新浮動隱藏*/
.info_fix {
    display: none;
}

.edit_part {
    padding: 0;
}


/* = = = 按鈕列 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


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


.main_header_area{
    /*box-shadow: 1px 1px 10px rgba(0,0,0,0.07);*/
	background: rgb(255 255 255 / 100%);
	padding: 0px 65px;
}

.pageIndex .main_header_area{
	/*background: #fcfdea;*/
	transition:.3s;
}

.header_area.sticky .main_header_area{
	background: rgb(255 255 255 / 100%);
}

.header_area,.header_area.sticky {
    /*z-index: 20000000;*/
	padding: 0px;
}

.main_header_area .container {
    max-width: 1750px;
    margin: 0;
}
/*選單最大寬度設定*//*
.main_header_area .container {    max-width: 95%;}
*/
.navigation {
	grid-template-columns: 200px 1fr;
}

.nav-header {
    max-width: 100%;
}
.nav-brand {
	max-width: 120px;
}

/*按鈕列LOGO-圓造型*/
@media screen and (min-width:1025px){
	.nav-brand {
        max-width: 100%;
        width: 125px;
        height: 105px;
        display: flex;
        justify-content: center;
        align-content: center;
        align-items: center;
        border-radius: 90%;
        padding-top: 0px;
        margin: auto;
        position: absolute;
        left: 0px;
        top: 30px;
        background: #FFF;
    }

}


/*電腦LOGO
.nav-brand {}
*/

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



/*第一層*/
.stellarnav > ul > li > a{
	transition:all 0.3s;
	/*color: #FFF;*/
}
.stellarnav > ul > li > a{
	/*margin: 30px 1vw 20px;*/
	margin: 15px 0.6vw 10px;
	padding:0px 5px;
}

.stellarnav > ul > li.has-sub > a {
    padding-right: 0px;
}
.stellarnav > ul > li:hover > a{color: #008edd !important;text-shadow: unset !important;}

.stellarnav li.has-sub > a:after {
    height: 8px;
    width: 8px;
    display: block;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: transparent #777 #777 transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: border .2s;
    transition: border .2s;
    margin: 0px;
    top: 40px;
    right: -13px;
}

.stellarnav li.has-sub:hover > a:after {
    border-color: transparent #2edaff #2edaff transparent !important;
}

@media screen and (min-width:769px) {
	.stellarnav > ul > li > a, .stellarnav li.has-sub > a{
		position:relative;
	}
	
	.stellarnav > ul > li > a::before{
		position:absolute;
		content:"";
		width:0%;
		height:1px;
		background: #2edaff;
		bottom:0px;
		left:50%;
		transform:translate(-50%,0px);
		transition:.5s;
	}
	
	.stellarnav > ul > li:hover > a::before{
		width:100%;
	}
	
	.stellarnav > ul > li:hover > a b {
		transform: translateY(-40px);
		-webkit-transform: translateY(-40px);
		-moz-transform: translateY(-40px);
	}
}

/*第二層*/
.stellarnav ul ul {
    background: transparent;
    /*width: 185px;*/
}
.stellarnav > ul > li.drop-left > ul {
    /*right: unset;
    left: 0px;*/
}
.stellarnav li li {
    border: unset;
	margin-bottom: unset;
}
.stellarnav li li > a , .stellarnav li li.has-sub > a{
	padding: 10px 15px;
	transition: all 0.5s;
	color: #FFFFFF;
	/*border-bottom: 1px solid rgb(255 255 255 / 5%);
    background: rgb(0 0 0 / 40%);*/
	border-bottom: 1px solid rgb(255 255 255 / 20%);
    background: #07CDB9;
	
}
.stellarnav li li:hover > a , .stellarnav li li.has-sub:hover > a{
	padding-left: 20px;
}


@media screen and (min-width: 769px) {
	.stellarnav li li:hover > a , .stellarnav li li.has-sub:hover > a{
		/*background: rgb(0 0 0 / 70%);*/
		background: #07CDB9;
	}
}

/*第三層*/
@media screen and (min-width: 769px){
	.stellarnav li li.has-sub > a:after, .stellarnav li.drop-left li.has-sub > a:after {
		height: 8px;
		width: 8px;
		display: block;
		border-style: solid;
		border-width: 0 1px 1px 0;
		border-color: transparent #FFF #FFF transparent !important;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		-webkit-transition: border .2s;
		transition: border .2s;
		margin: 0px;
		top: 18px !important;
		right: 15px;
	}
	
	.stellarnav li.drop-left li.has-sub > a:after {
		-webkit-transform: rotate(-225deg);
        transform: rotate(-225deg);
	}
	
	.stellarnav li li.has-sub:hover > a:after, .stellarnav li.drop-left li.has-sub:hover > a:after {
		border-color: transparent #FFF #FFF transparent !important;
	}
	
}
.stellarnav li ul ul {
	background: transparent;
}

.stellarnav li ul ul li > a{
	/*background: rgb(0 0 0 / 70%);
    border-bottom: 1px solid rgb(255 255 255 / 5%);*/
	background: #008edd;
    border-bottom: 1px solid rgb(255 255 255 / 20%);
}

.stellarnav li ul ul li:hover > a{
	background: #008edd;
}

.stellarnav > ul > li:nth-of-type(1) {display: none;}

/* 商品下拉超過30個變大 */
.stellarnav.desktop li.bigMenu>ul{display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); left: 0; width: 100%; position: fixed; padding: 20px;}
.stellarnav.desktop li.bigMenu ul ul{top: 100%; left: 0; width: 100%; background: #efefef; height: auto; max-height: 300px; overflow: auto;}
.stellarnav.desktop li.bigMenu ul ul li{margin: 0;} 
.stellarnav.hasBigMenu li.bigMenu li.has-sub > a:after{border-left: 6px solid transparent; border-bottom:unset; border-right: 6px solid transparent; border-top: 6px solid #898989; right: 5px;}


/* 主分類超過30個但次分類直接顯示 */
/*.stellarnav.desktop li.bigMenu>ul{grid-gap: 10px;}
.stellarnav.desktop li.bigMenu li{border: 0;}
.stellarnav.desktop li.bigMenu>ul>li>a{border: 1px solid #ddd;}
.stellarnav.desktop li.bigMenu ul ul{display: block !important; position: relative; top: 0; background: unset; border: 0;}
.stellarnav.desktop li.bigMenu ul ul li{border: 0;}



/*SubMenu*/
.shop_search_btn {  background: #008edd; transition:.3s;height: 28px;margin-top: 0px;}
.shop_search_btn:hover {  background: #008edd;}
.me_tp_features a.tp_btn_cart, .me_tp_features a.tp_btn_notice {
    transition:.3s;
	/*color: #FFF;*/
}
.me_tp_features a.tp_btn_cart:hover, .me_tp_features a.tp_btn_notice:hover {
    color: #008edd;
}
.header_area .me_tp_features {
	padding: 10px 1vw 5px;
}
.tp_links a{transition:all 0.3s;}
.tp_links a:hover {    color: #008edd;}

/*隱藏選單按鈕連結*/
.me_tp_features {
	/*display: none;*/
}
.tp_links{display: none;}


/*隱藏購物車搜尋欄*/
/*.box_search{display:none;}*/

/*隱藏購物車*/
/*.me_tp_features a.tp_btn_cart {display: none;}*/

/*隱藏匯款通知*/
/*.me_tp_features a.tp_btn_notice{display: none;}*/


/*按鈕列RWD*/

@media screen and (max-width: 1024px){
	/*Header/＝＝＝＝＝*/
	.header_area {
		background: #FFF;
	}
	.header_area.sticky {
		background: transparent;
	}
	
	.navigation {    padding: 0px;}
	.stellarnav > ul > li > a {
		margin: 5px 1vw;
	}
	.stellarnav li.has-sub > a:after {
		/*top: 25px;*/
		right: calc(1vw - 13px);
	}
	/*Logo/＝＝＝＝＝*/
	.header_area .nav-brand{max-width: 160px;margin-top: 20px;margin-bottom: 0px;transition: .5s;}
	.header_area.sticky .nav-brand{max-width: 160px;}
	
	
}

@media screen and (max-width: 768px) {
	
	/*首頁固定選單*//*
	.pageIndex .header_area{position: position:relative;}*/
	
	
	.stellarnav li li > a , .stellarnav li li.has-sub > a{    padding: 15px !important;border-left:none;}
	.stellarnav li li:hover > a , .stellarnav li li.has-sub:hover > a{padding: 15px !important;/*border-color:transparent;*/}
	.stellarnav.mobile li a {
		border-bottom: 1px solid rgba(255, 255, 255, .20);
	}

	.navigation {
        align-items: flex-start;
    }
	.nav-header {
		text-align: left;
		line-height: 0px;
		justify-content: flex-start;
	}
	.header_area .nav-brand{
		max-width: 85px;
        margin: 5px auto 5px 10px;
	}
	.header_area.sticky .nav-brand{
		max-width: 85px;
	}
	.main_header_area {
		padding: 0px 0px;
	}
	.stellarnav.mobile {
		position: absolute;
		left: 0;
		top: 0px;
		width: auto;
		display: inline-block;
		right: 0px;
		left: unset;
	}
	
	.stellarnav .menu-toggle {
        padding: 15px 10px;
    }
	
	.stellarnav.mobile.left > ul {
		max-width: 100%;
		padding: 10px;
		background: rgba(255,255,255,0.95);
	}
	
	.stellarnav.mobile.right .close-menu, .stellarnav.mobile.left .close-menu {
		background: unset;
	}
	.stellarnav.mobile li.drop-left ul ul {
		left: 0px;
	}
	.stellarnav.mobile li li:last-child > a {
		border-bottom: unset;
	}
	
	.stellarnav.mobile li li li:last-child > a {
		border-bottom: 1px solid rgba(255, 255, 255, .15);
	}
	
	.stellarnav.mobile > ul > li > a {
		border-bottom: unset;
		margin: 3px 0px;
	}
	.stellarnav > ul > li > a, .stellarnav li.has-sub > a {
		margin: 0px;
	}
	.stellarnav.mobile li.open {
		background: unset;
		padding: 0px;
	}
	.stellarnav.mobile li.open li.open {
		background: unset;
		padding: 0px;
	}
	
	.stellarnav li li a.dd-toggle .icon-plus:before, .stellarnav li li a.dd-toggle .icon-plus:after {
		content: '';
		display: block;
		width: 12px;
		height: 0px;
		top: 50%;
		border-bottom: solid 3px #FFFFFF;
		position: absolute;
	}
	
	.me_tp_features {
		padding: 5px 1vw 0px;
		background: #2edaff;
		margin: 0px;
	}
	
	.me_tp_features a.tp_btn_cart, .me_tp_features a.tp_btn_notice {
		color: #ffffff !important;
		display: inline-block;
		margin: 2px;
	}
}
@media screen and (max-width: 380px) {
	.me_tp_features a.tp_btn_cart, .me_tp_features a.tp_btn_notice {
        display: none;
    }
	
	.box_search {
		width: 75%;
	}
	
	.box_search input[type=text] {
		max-width: 100%;
	}
}

/* = = = 頁尾 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


.footer {
	background: #f5fdff;
	padding: 30px 0 0;
}
.footer_logo {
	text-align: center;
    margin: 20px auto 0px;
}

.footer_logo a{
	/*filter: invert(100%) grayscale(100%) brightness(500%);
    -webkit-filter: invert(100%) grayscale(100%) brightness(500%);*/
}
.footer_logo img {
	max-width: 100%;
	width: 150px;
}
.footer_info li p, .footer_info li p a{
	color:#008edd;
}

.footer_info {
    display: grid;
    grid-template-columns: 300px 1fr;
    grid-gap: 20px;
    align-items: center;
}

.footer_menu {
	/*display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(110px,100%), 1fr));
	gap: 5px;*/
	display: flex;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}

/*footer按鈕最小寬度100px*/
.footer_menu a {
	margin: 0;
	text-align: center;
	padding: 3px 10px;
	transition: all 0.3s;
	background: unset;
    border: unset;
	margin: 0 5px 4px 5px;
	color: #008edd;
}
.footer_menu a:hover {
	color: #008edd;
	background:unset;
	font-weight: 600;
}

.footer_menu a:first-child {display: none;}
.footer_menu a:nth-child(2) {display: none;}

.copy {
    background: #2edaff;
	color: #fff;
	border:none;
	padding: 12px 0px;
}
.copy a{    color: #fff;transition:all 0.3s;}
.box_link a{
	transition:all 0.3s;
	border: 1px #FFF solid;
    color: #FFF;
}
.box_link a:hover {
	background: #2edaff;
    color: #FFF;
}

.footer_info li:nth-child(1) {
    padding-bottom: 20px;
	max-width: 800px;
}
.footer_info li p {
    width: 100%;
}

.footer_info li:nth-child(2) {
	border-top: 1px rgba(255,255,255,0.3) solid;
    padding: 15px 0px 10px;
	margin: 0px;
}


@media screen and (max-width: 980px) {
	.footer_info {
		grid-template-columns: 1fr;
		grid-gap: 10px;
	}
	
	.footer_info ul {
		width: 100%;
	}
}


@media screen and (max-width: 768px) {
	.footer_info ul {
		width: 100%;
	}
	.footer_info li {
		text-align: center;
	}
	.footer_menu {
		justify-content: center;
	}
	.footer_menu a {
		padding: 5px 5px;
	}
	
	.footer.with_shopping_mode { padding:35px 0 54px; }
	
	.footer_logo {    
		text-align: center;
		max-width: 170px;
        background-size: 100%;
        width: 100%;
		margin: 0px auto;
	}

	.footer_info li:nth-child(1) {
		padding-top: 0px;
	}
	
	.footer_info li p {
		width: 100%;
	}
	
	.box_link {
		right: unset;
		justify-content: center;
	}
}

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

@media screen and (max-width: 375px) {
	.footer_menu a {
		padding: 5px 0px
	}
}


/*頁尾-ICON連結重新排版*/

@media screen and (min-width: 769px) {
	.footer_info {
		padding: 0 0;
	}
	
	.box_link {
		display: none;
	}
}

.box_link {
    width: fit-content;
	max-width: unset;
	right: 0px;
    top: 0px;
	display: flex;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
	flex-direction: unset;
    flex-wrap: wrap;
}

.box_link a {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 40px;
    height: 40px;
    line-height: 0px;
    letter-spacing: 0px;
    padding: 0px;
    border-radius: 50px;
    margin: 0px 4px;
	font-size: 20px;
}
@media screen and (max-width: 980px) {
	.box_link {
		left: unset;
		right: 20px;
		top: 10px;
		bottom: unset;
	}
}

@media screen and (max-width: 768px) {
	.box_link {
		justify-content: center;
		position: unset;
		margin: auto;
	}
}


/*頁尾重新排版*/

.footer {
	padding: 40px 0 0;
}
.footer .center {
    max-width: 1450px;
}

.box_link a {
    width: 35px;
    height: 35px;
	border: unset;
}

.box_link a:hover {
    background: unset;
	opacity: 0.7;
}

@media screen and (min-width:981px){
	.footer_info ul {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		align-content: flex-start;
	}
	.footer_info li:nth-child(1) {
		padding-bottom: 0px;
		width: 330px;
	}
	.footer_info li:nth-child(2) {
		border: unset;
		padding: 10px 0px;
		width: calc(100% - 350px);
	}
	.footer_menu {
		justify-content: flex-end;
	}
	.copy {
		margin-top: 30px;
	}
	.box_link {
		top: unset;
		right: 10px;
		bottom: 0px;
		justify-content: flex-end;
		align-items: flex-end;
		align-content: flex-end;
	}
}


/* = = = BANNER = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*首頁大圖點點*/
.swiper-pagination {
    display: none;
}

/*預設解除背景輪播*/
#content_main { margin:0;}
.bannerindex { position:relative; height:auto;}
.swiper-banner { position:static; margin:0; height:auto;} 
.swiper-banner .swiper-slide img { height:auto;}
@media screen and (max-width: 768px) {
.bannerindex { padding:0; margin:0;}
}


/*內頁BANNER 設定*/

.banner {
	height: 550px;
	display: flex;
	justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
	padding: 0px;
	background: url(https://pic03.eapple.com.tw/bewaterfilter/bn_01.jpg)no-repeat 70% center;
	background-size: cover;
}


.banner.banA {/*background: url(https://pic03.eapple.com.tw/yclaws/title_bg01.jpg)no-repeat center center;*/}

.article_a .banner.banblog {/*background: url(https://pic03.eapple.com.tw/yclaws/title_bg02.jpg)no-repeat center center;*/}

.article_b .banner.banblog {/*ackground: url(https://pic03.eapple.com.tw/yclaws/title_bg03.jpg)no-repeat center center;*/}

.other_page .banner.banB {/*background: url(https://pic03.eapple.com.tw/yclaws/title_bg04.jpg)no-repeat center center;*/}

.banner.banC {}
.banner.banD {}
.banner.banE {}

.banner h5::before{
	font-family: "Goldman", sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 20px;
    display: block;
	letter-spacing: 1px;
	color: #FFF;
	margin-bottom: 5px;
}

.banner h5{
	font-size: 35px;
    font-family: "Noto Sans", "Noto Sans TC", sans-serif;
    letter-spacing: 8px;
    font-weight: 600;
    color: #FFF;
    max-width: 1600px;
    width: 100%;
    padding: 70px 8vw 0px;
    text-align: left;
    text-shadow: 0px 0px 20px rgb(0 0 0 / 50%);
	/*text-shadow: 0px 0px 10px rgb(255 255 255 / 100%), 0px 0px 10px rgb(255 255 255 / 100%), 0px 0px 20px rgb(255 255 255 / 100%);*/
    line-height: 1.3;
}

.banner h5::after{
	content: "";
    max-width: 450px;
    width: 100%;
    height: 1px;
    background: #FFF;
    display: block;
    margin: 15px 0px;
}

body.map_page .banB h5::after{
	content: "聯絡我們";
    height: unset;
    background: unset;
    border-bottom: 1px #cbb08d solid;
    margin-top: 0px;
    padding-bottom: 15px;
}



@media screen and (max-width: 1920px){
	.banner {
		/*background-size: 1920px;*/
	}
}

@media screen and (max-width:1200px) {
	.banner {
		/*background-size: 1700px !important;*/
		height: 520px;
	}
	
	.banner h5::before {
		/*font-size: 50px;*/
	}
	
	.banner h5{
		font-size: 35px;
	}
}

@media screen and (max-width:1024px) {
	.banner {
		/*background-size: 1350px !important;*/
		height: 380px;
	}
	
	.banner h5 {
		padding: 60px 8vw 0px;
	}
}

@media screen and (max-width:768px) {
	.banner {
		/*background-size: 1000px !important;*/
		height: 265px;
	}
	
	
	.banner h5::after {
		max-width: 340px;
	}
}


@media screen and (max-width:600px) {
	.banner h5 {
		font-size: 26px;
	}
	.banner h5::before {
		font-size: 18px;
	}
}

@media screen and (max-width:480px) {
	.banner {
		/*background-size: 700px !important;
    	height: 200px;*/
		background-size: cover !important;
        height: 150px;
	}
	
	.banner h5 {
		padding: 35px 6vw 0px;
	}
	
	.banner h5::after {
		max-width: 270px;
	}
}

/* = = = 其他設定 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

.sb_marquee {
    display: none;
}
#page{
	/*background: url(https://pic03.eapple.com.tw/fanglongenterprise/bg.jpg) repeat top center;
    background-size: 100%;*/
}

#content_main, #content {
    /*background: url(https://pic03.eapple.com.tw/wandanshantomb/bg.jpg)repeat center center;
    background-size: 100%;*/
	background: #ffffff;
}

/*按鈕/＝＝＝＝＝*/
.animated-arrow {    background: #ecc978;transition: .3s;}
.animated-arrow:hover {    background: #feb671;}


/*麵包屑＝＝*/
.path p a:hover {    color: #ADA17E;}
.path {display: none;}


/*下拉編輯器*/
body.other_select_page .promotion_title, body.other_select_page .other_promotion, body.other_select_page .page {
    display: none;
}


/* = = = 購物車 = = = = = = = = = == = = = = = = = = = = = = = = == = = */


/*購物車首頁*/

/*首頁只顯示4則*/
.prod_part .products-list .item:nth-of-type(n+5) {
	display:none;
}


/*購物車列表*/
.products-list .item a {
    /*padding-bottom: 50px;*/
	/*padding-bottom: 0px;*/
}
.products-list .price {
    /*display: none;*/
}

.products-list .price b,
.pd_lightbox_pdInfo blockquote p{
    color: #d1a847;
}

.products-list .price b.ori_price,
.pd_lightbox_pdInfo blockquote p#ori_price {
    color: #AAA;
	text-decoration: line-through;
}

.products-list .more{
	/*display: none;*/
}

.products-list .more, 
.products-list .item a + button.pd_btn {
    border: 1px #008edd solid;
    background: #008edd;
	color: #FFF;
}


.products-list .item a:hover .more,
.products-list .item a + button.pd_btn:hover{
	border: 1px solid #09E9D3;
    background: #09E9D3;
}

.products-list .pic img, .related_list li figure img {
    transition: .5s;
    transform: scale(1);
}

.products-list a:hover .pic img, .related_list li:hover figure img {
    transform: scale(1.05);
}

.products-list .pic::before, .related_list li figure::before {
    content: "+";
    font-size: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 35px;
    height: 35px;
    z-index: 999;
    text-align: center;
    line-height: 1.2;
	letter-spacing: 0px;
    border-radius: 50%;
    color: #FFFFFF;
    border: 2px #FFFFFF solid;
    opacity: 0;
    transition: .5s;
}

.products-list .pic::after, .related_list li figure::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: .5s;
}

.products-list a:hover .pic::before, .products-list a:hover .pic::after, .related_list li:hover figure::before, .related_list li:hover figure::after  {
    opacity: 1;
}

.products-list .name, .related_list li a p {
	transition: .3s;
}

.products-list a:hover .name, .related_list li:hover a p {
    color: #008edd;
}


/*購物車詳細*/

.sidebarBtn {
    border: unset;
	background: transparent;
}

.inquiry_a1, .inquiry_a2, .inquiry_a3, .lastPage {
    background: #008edd;
	transition: all .5s;
}

.inquiry_a1:hover, .inquiry_a2:hover, .inquiry_a3:hover, .lastPage:hover {
    background: #008edd;
}

a.pdinfo_line {
    background-color: #91c991;
}

a.pdinfo_line:hover {
    background-color: #7ab97a;
}

a.pdinfo_tel {
    background-color: #008edd;
}

a.pdinfo_tel:hover {
    background-color: #008edd;
}

.toShare {
    border-top: 1px solid #dfd7bf;
}


.sidebarBtn .price {
    border-bottom: 1px #dfd7bf solid;
}

.sidebarBtn .price span.ori_price {
    color: #AAA;
    text-decoration: line-through;
}

.sidebarBtn .price span {
    color: #008edd;
}

.prod_related h6 span:before {
    content: '相關推薦';
    font-size: 24px;
    color: #008edd;
}
.prod_related {
    background: unset;
}

.related_list li figure {
    position: relative;
}

.related_list li a p {
    margin-top: 15px;
	text-align: left;
}

.related_list li a {
    background: transparent;
}


/*預設購物車版面 產品分類選單在左側 商品內頁詳細介紹下表單更改樣式 by shint at 2023.1.5  */
.product_page .main_part { max-width:1500px;}
/* .product_info_page .main_part { max-width:1200px;} */

.product_page .show_content,
.product_info_page .show_content { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start; align-content: flex-start;}
.product_page .product_menu_list { position: relative; width: 220px; letter-spacing: 1px; /*border-right: 1px solid #ccc;*/min-height: 30vw;}
.product_page .products-list,
.product-wrapper { width: calc(100% - 270px);}
ul.page { width: 100%;}


.product-layer-two li a {
    line-height: 200%;
	background: unset;
	color: #222;
	border: unset;
	transition:.5s;
}

.product-layer-two li i {
    top: 5px;
	color: #222;
	transition:.5s;
}
.product-layer-two li > a, .product-layer-two li.active > a {
	border: unset;
}
.product-layer-two li:hover > a, .product-layer-two li.active > a {
    color: #FFF;
    background: #2DD9FF;
    padding-left: 25px;
}

.product-layer-two li:hover i, .product-layer-two li.active i {
	color: #FFF;
}


.product-layer-two li ul { position:static; /*display:block !important;*/ width:100%; margin-left:0;}
.product-layer-two li:hover ul { border: none !important; /*display:block !important;*/}
.product-layer-two li li { display: block; padding:0; transition:all ease .3s;}
.product-layer-two li li a{ padding:5px 10px;background: unset;}
.product-layer-two li li:hover > a { background:unset; color:#008edd;}
.product-layer-two li li.active a { color:#008edd;}
.product-layer-two > li { width:100%; max-width:100%; padding:0; text-align:left; border-bottom:1px dotted #ccc; }
.product-layer-two > li ul > li { margin-top:5px;background: unset;}

.product_info_page .product-layer-two { display: none;}
.product_info_page .products-list,
.product-wrapper { width: 100%;}

.product-layer-two li li > a:before { content: ""; position: absolute; width: 8px; height: 8px; background: transparent; left: 10px; margin-left: 0px; top: 50%; margin-top: -4px; clip-path: polygon(0 0, 100% 50% , 0 100%);transition:.5s;}
.product-layer-two li li:hover > a:before, .product-layer-two li li.active > a:before { background:#008edd;}

.product_info_page .half_box { width: 100%; float: none; padding-right: 0;}
.product_info_page .half_box li.btn_blankTop { margin-top: 50px; justify-content: space-between; display: flex;}
.product_info_page .half_box li.btn_blankTop input { width: calc(50% - 10px); background-image: none; padding: 0; text-align: center;}


@media screen and (max-width: 1200px) {
	.related_list {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        grid-gap: 10px;
    }
}
@media screen and (max-width: 980px) {
}
@media screen and (max-width: 768px) {
.product_menu_list,
.products-list,
.product-wrapper { width: 100%;}
.product-layer-two { margin-right: 0; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); /*grid-gap: 5px;*/}
.product_page .product-layer-two,
.product_page .products-list { width: 100%; border-right: none;}
.product_page .product_menu_list>h5{display: block;font-size: 20px;}

.product_page .show_content > a { order: 1;}
.product_page ul.products-list { order: 2;}
.product_page ul.page { order: 3;}
.product_page .product_menu_list {width: 100%; order: 0; min-height: unset;}
}
@media screen and (max-width: 600px) {
	/*手機版購物車-首頁、列表頁、相關產品排列統一*/
	.pageIndex .products-list, .products-list, .related_list {
		grid-template-columns: 1fr;
		grid-gap: 20px;
		max-width: 500px;
		margin: auto;
	}
            
}


/* = = = 文章管理 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

/*首頁文章管理*/
.products-box {    width: 90%;    max-width: 1300px;    margin: 100px auto;    border-top: 1px solid #ccc;    padding-top: 50px;}
.module_i_news ul {  display: flex;  flex-wrap: wrap;   max-width: 1400px;}
.module_i_news li {width: 23%;  padding: 10px;  background: #ffffff; border: 1px solid #eee;}
.i_blog_ri , .i_blog_le { width: 100%;}
.i_blog_ri p {  font-size: 15px;   color: #666;   line-height: 150%;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;   white-space: normal;  overflow: hidden;  word-break: break-all;}

.module_i_news li a {  position: relative;  display: flex;  grid-gap: 10px;  flex-direction: column;}
.module_i_news li a:before , .module_i_news li a:after , .subbox_item a:before , .subbox_item a:after{    transition: 0.3s;}
.module_i_news li a:after , .subbox_item a:after{ background: rgba(135, 176, 222, 0.7);content: none;}
.module_i_news li a:before, .subbox_item a:before { background: rgb(90 90 90 / 80%); color: #fff;}
.module_i_news li a:before , .subbox_item a:before { transform: translateX(-50%);    width: 100%;   top: unset; }
.module_i_news li a:hover:before , .subbox_item a:hover:before { opacity: 1;  transform: translateX(-50%);  bottom: 0;}
.module_i_news li a:before {  left: 50%;   font-size: 18px;  padding: 10px 5px;}


.module_i_news .title_i_box h4 { 	color: #555;font-size: 16px;}
.module_i_news .title_i_box h4:before {  content: "ARTICLE";  display: block;   font-family: "Oswald", sans-serif;   color: #008DDC;   font-size: 36px;  letter-spacing: 1px;  margin-bottom: -5px;}


/*文章分享變1排3個*/
.blog_page .main_part {    max-width: 1400px;}
.blog_list_le , .blog_list_ri {    width: 100%;}
.blog_subbox {    display: flex;    flex-wrap: wrap;    justify-content: flex-start;}
.subbox_item { width: calc(100% / 3);  padding: 5px;}
.i_blog_ri em { font-size: 12px;   font-style: normal;  display: block;   margin: 5px 0;}

@media screen and (max-width: 980px) {
.module_i_news li , .subbox_item {    width: 31%;}
.module_i_news ul {    max-width: 100%;}
.products-box {    margin: 70px auto;}
.module_i_news {    padding: 70px 20px;}
}

@media screen and (max-width: 768px) {
.module_i_news li , .subbox_item {    width: 48%;}
}

@media screen and (max-width: 600px) {
.module_i_news {    padding: 50px 20px;}
.module_i_news li , .subbox_item{    width: 100%;    margin: 0 auto;    max-width: 350px;}
.products-box {    margin: 50px auto;}
.module_i_news .title_i_box h4 {    font-size:32px;}
}


/*------------------------------------------------------------------------------*/



/*文章設定*/

h5.blog_le_t { font-family: 'Noto Sans TC','Microsoft JhengHei', sans-serif;}
h5.blog_le_t span { font-family: 'Geologica';}
h5.blog_le_t {letter-spacing: 0;}
.accordion li .link a {font-weight: 500;}
.blog_search input[type=search] {border-radius: 0;}
.blog_le .accordion {  border-radius: 0;   border: NONE;}
.accordion li:not(:last-of-type) {  border-bottom: 1px solid #fff;}
.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category {  transition: all 0.3s;  background: linear-gradient(180deg, #96b9d9, #8aa4C7) !important;}
.blog_subbox {  display: grid;  grid-template-columns: 1fr 1fr 1fr;  grid-gap: 10px;  background: #ffffff5e; padding: 12px;}
.blog_subbox:before {content: none;}
.subbox_item {   width: 100%;  margin-bottom: 0;}
.blog_list_le {  padding: 0; width: 100%;}
.blog_list_ri {  padding: 12px 0;  width: 100%;}
.blog_list_ri em {   font-size: 12px;  color: #999; font-style: normal;  display: block;  margin: 5px 0;}
.blog_list_ri p { -webkit-line-clamp: 2;  line-height: 160%;   font-size: 14px;   font-weight: bold;   letter-spacing: 0.5px;}
.blog_list_le {  position: relative;  height: auto;  aspect-ratio: 4/3;   overflow: hidden;}
.blog_list_le img {   min-width: 100%;   display: block;  width: 100%;  margin: 0 auto;  height: 100%;   object-fit: cover;  object-position: center;}
h4.blog_category_title { border-bottom: 1px #afafaf solid;    color: #545454;}
.submenu a:hover { background: #666;  color: #FFF;}
.submenu a {  display: block;   position: relative;  color: #666;   padding: 13px 6px 12px 29px;  letter-spacing: 1px;  font-size: 12px;}
.subbox_item a:before, .subbox_item a:after {content: none;}
.subbox_item a:hover .blog_list_le:before, .subbox_item a:hover .blog_list_le:after {  opacity: 1;}
.subbox_item a .blog_list_le:after {  content: '';
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 8;
    background: rgba(0,0,0,.7);
    opacity: 0;
    transition: all .4s;
}
.subbox_item a .blog_list_le:before {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    content: 'VIEW MORE +';
    font-size: 14px;
    font-weight: 400;
    color: #f0f0f0;
    transform: translate(-50%, -50%);
    width: 148px;
    height: 40px;
    left: 50%;
    top: 50%;
    z-index: 9;
    opacity: 0;
    transition: ease all .4s;
    letter-spacing: 1px;
}
	
.blog_list_ri h5 {
    font-weight: bold;
    font-size: 20px;
    color: #008DDC;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
}

/*內頁*/
.blog_back {  width: 100%;   margin: 0 auto;  display: grid;  grid-template-columns: repeat(3, 1fr);  grid-gap: 10px;  justify-content: center;}
.blog_back a {width: 100%;}
.blog_back a.article_btn_back {  background: #00a0e8;}
.blog_back a.article_btn_prev {
    background: #008DDC;
}
.blog_back a.article_btn_next {
    background: #008DDC;
}
.inquiry_a1:hover, .inquiry_a2:hover, .inquiry_a3:hover, .lastPage:hover {
    background: #008edd;
}
h5.blog_le_t, .blog_le .accordion {  display: block;}
.news_related {
    background: #ffffff;
    padding: 25px 15px;
}

@media screen and (max-width: 1024px) {
.blog_subbox {  grid-template-columns: 1fr 1fr;}
}

@media screen and (max-width: 768px) {
.blog_subbox {  grid-template-columns: 1fr; }
}

/*※※※※※【【  此案件更動處↓↓↓  】】※※※※※*/
/*側邊*/
.blog_le .accordion > li:hover, .blog_le .accordion > li.on_this_category { background: linear-gradient(180deg, #2DD9FF, #008DDC) !important;}
.subbox_item a { display: grid;  grid-template-columns: auto;  position: relative;  grid-gap: 20px;}
.news_related h6 span:before {  content: '相關文章';  font-size: 24px; color: #545454;}
.lastPage {   background: linear-gradient(180deg, #2DD9FF, #008DDC);}
.news_related_list li a {   background: transparent;}
.articel_mainPic img { display: none; max-width: 100%;}


/*●●●●●●●●●●●●●●●●●●●●●●●●   促銷方案&小撇步文章分享   ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*※※※※※【【  固定區塊不動↓↓↓  】】※※※※※*/
/*首頁*/
.news_part .title_i_box h4{color: #555;}
.news_list ul li a:hover {background: #eee;}
/*詳細頁*/
.show_content .edit{line-height: 180%;font-weight: 300;}
.promotion_title {position: relative;border-bottom: 1px solid #d8d8d8;padding-bottom: 20px;}
.promotion_title em {display: block;border: none;font-size: 14px;font-weight: 300;padding: 0;}
.promotion_title span {border: none;color: #545454;padding: 0;margin: 0;
position: absolute;right: 0;bottom: 15px;font-weight: 300;letter-spacing: 2px;}
.promotion_title span:before{content: "發布時間";display: block;font-weight: 400;}
.promotion_title h2{display: block;font-weight: 400;font-size: 24px;}
.other_promotion {margin-top: 200px;}
.other_promotion:before{content: "Read More";display: block;color: #008DDC;padding:10px 15px;}
.other_promotion li{border-bottom: 1px solid #ddd;width: 100%;margin-left: 0;}
.other_promotion li:last-child{border-bottom: none;}
.other_promotion li a {display: flex;width: 100%;margin: 0;font-weight: 300;padding: 25px 15px;border: none;}
.other_promotion li a:before{display: none;}
.other_promotion li a:after{display: none;}
.other_promotion li a:hover {background: transparent;}
.other_promotion .pmtTime {width: 150px;}
.other_promotion .pmtTime span{float: left;letter-spacing: 2px;}
.other_promotion .pmtTitle{width: calc(100% - 160px);}
.other_promotion .pmtTitle span{display: none;}
.other_promotion .pmtTitle h3 {font-size: 14px;height: auto;min-height: auto;margin: 0;padding-left: 30px;
letter-spacing: 2px;font-weight: 300;color: #545454;position: relative;}
.other_promotion .pmtTitle h3:before{content: "〉";font-size: 12px;color: #888;transition: all .5s;
position: absolute;left: 10px;top: 50%;transform: translateY(-50%);}
.other_promotion { display: block;}


@media screen and (max-width: 768px){
	.promotion_title h2 {font-size: 18px;}
}
@media screen and (max-width: 450px){
	.other_promotion li a {flex-wrap: wrap;}
	.other_promotion .pmtTitle {width: 100%;}
	.other_promotion .pmtTitle h3 {padding-left: 0;}
	.other_promotion .pmtTitle h3:before{display: none;}
}
/*※※※※※【【  此案件更動處↓↓↓  】】※※※※※*/

.i_news_b a i.fa-solid.fa-arrow-right { margin: 0;}
.i_news_b a:hover i.fa-solid.fa-arrow-right { margin:0}
.animated-arrow {  background: #008DDC;  font-size: 14px;  width: 170px;  letter-spacing: 1px;}
b, strong {  font-weight: 500;}
.animated-arrow:hover {  background: #008DDC;}
.news_list ul li p:after { content: 'Read more';}


.news_part .title_i_box h4:before {  content: 'NEWS';  display: block;  font-family: "Oswald", sans-serif;   color: #008DDC; font-size: 36px; letter-spacing: 1px;margin-bottom: -5px;}
.news_part .title_i_box h4 { color: #545454;  font-size: 16px;}
.news_part {  width: 100%;  padding: 50px 20px; background: #fff;}


.i_blog_b a i.fa-solid.fa-arrow-right { margin:0 }
/* hover */
.i_blog_b a:hover i.fa-solid.fa-arrow-right { margin:0px;}


@media screen and (max-width: 1200px){
.news_list ul li {  border: none;  margin-bottom: 7px;  background: transparent;	border-bottom: 1px #eee solid; }}



/* = = = 相簿 = = = = = = = = = == = = = = = = = = = = = = = = == = = */

.show-list .show_name {
    font-size: 17px;
    color: #545454;
    letter-spacing: 0.15em;
    line-height: 1.5;
    margin-top: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 26px;
}
.subalbum-menu h2 {
    color: #545454;
}
.show-list .item:hover .show_name, .other_subalbum li:hover a p {
    color: #008DDC;
}
.other_album_choice li {
    background: #008DDC;
	transition:.3s;
}
.other_album_choice li:hover {
    background: #008DDC;
}
.other_subalbum li a p {
    font-size: 17px;
    color: #545454;
    letter-spacing: 0.15em;
    line-height: 1.5;
    margin-top: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 26px;
    font-weight: 600;
	transition:.3s;
}

/*影片*/

.video-layer-two li a {
    position: relative;
    border: 1px #fff solid;
    background: #effcff;
    padding: 7px 16px;
    display: block;
    font-size: 16px;
    color: #008edd;
    font-weight: bold;
}

.video-list .vidTitle {
    font-weight: bold;
    color: #545454;
    letter-spacing: .05em;
    margin-top: 15px;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 3em;
    margin-bottom: 10px;
    font-size: 17px;
}

/* = = = 聯絡我們(表單) = = = = = = = = = == = = = = = = = = = = = = = = == = = */

.contact_le_map a, .contact_form li.last cite {
    background: #2DD9FF;
	transition:.3s;
}

.contact_le_map a:hover, .contact_form li.last cite:hover {
    background: #008DDC;
}

.contact_form li .form__label {
	background: transparent;
}

.contact_form li:has(input[type=checkbox]) .form__insert, .contact_form li:has(input[type=radio]) .form__insert {
    grid-template-columns: repeat(auto-fit, minmax(13px, 13px) minmax(120px, 120px));
	margin-bottom: 10px;
}

.form select {
    width: 100%;
	height: 32px;
}


/*聯絡資訊-地址更改順序*/
.list_before {
    display: flex;
    flex-direction: column;
}
.info_TAXID:before {
    content: "地址";
}

.info_TAXID {
	order: 1;
}


@media screen and (min-width: 769px) { 
	.contact_content form{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		align-content: flex-start;
	}
}


@media screen and (max-width: 600px) { 
	.contact_content {
		padding-top: 0px;
	}
	
	.blank_letter.i{
		padding-top: 0px;
	}
}

.list_before.info li {
    padding-left: 37px;
}

.info_TEL:before, .info_TEL2:before, .info_PHONE:before, .info_LINE:before, .info_FAX:before, .info_TAXID:before, .info_MAIL:before, .info_ADD:before, .info_ADD2:before {
    width: 37px;
}*/

/* = = = RWD = = = = = = = = = == = = = = = = = = = = = = = = == = = */