@charset "utf-8";
/*Common Set*/
body
{
	font-size: 16px;
	margin: 0px;
	text-decoration: none;
	line-height: 165%;
	FONT-FAMILY:"Microsoft YaHei","微軟正黑體","Microsoft JhengHei", "細明體","MingLiU","ＭＳ Ｐゴシック", "新細明體", "PMingLiU",  Arial,taipei, Helvetica, sans-serif;
	 -webkit-text-size-adjust: 100%;

	
}	
a{
	 color:#000000;
	 text-decoration:none;
}
/*ipad或iphone會默認電話可撥自動加連結而改變樣式/所以在這加上這段*/
a[href^=tel]{ color: inherit; text-decoration: none; }

button{
	outline:none;
}
	
input,textarea,select,button,submit{
	font-size:16px;
	FONT-FAMILY:"Microsoft YaHei","微軟正黑體","Microsoft JhengHei", "細明體","MingLiU","ＭＳ Ｐゴシック", "新細明體", "PMingLiU",Arial,taipei, Helvetica, sans-serif;
}

/*表單藍框問題*/
input:focus{outline:none;}
textarea:focus{
	outline:none;
}

ul{
	padding:0;
	margin:0;
	list-style:none;
}


/* 解決浮動的CLEARFIX */
.cssfix:before, .cssfix:after { 
   content: "";
   display: table; 
}
.cssfix:after {
   clear: both; 
}
.cssfix { 
   zoom: 1; /* IE6&7 */ 
}

/*page number*/
#page_area{
	display:none;
		text-align:center;
}
#page_area2{
	display:block;
		text-align:center;
}

.pagination a, .pagination a:link, .pagination a:visited {
	color:#265827;
	padding:3px 6px;
	background:#ffffff;
	border:1px solid #ccc;
	TEXT-DECORATION: none;
	font-size:13px;
	letter-spacing:0px;
}
.pagination a:hover {
	color:white;
	background:#567556;
	border:1px solid #567556;
	letter-spacing:0px;
}
.pagination span {
	padding:3px 6px;
		font-size:13px;
		letter-spacing:0px;
}
.pagination a span {
	font-size:inherit;
	display:none;
	visibility:hidden;
		font-size:13px;
		letter-spacing:0px;
}
.pagination span.disable {
	padding:3px 6px;
	border:1px solid #eee;
	color:#ffffff;
	background:#999999;
		font-size:13px;
		letter-spacing:0px;
}
/*top*/
#top{
		display:block;
		z-index:999;
		
		position:fixed;
		top:0px;

		height:60px;
		/*position:fixed;
		top:0px;
		z-index:99;*/
		width:100%;
	
		border-bottom:1px #cccccc solid;	
		/*box-shadow:0px 4px 20px -2px #cccccc;*/	
		/*box-shadow: x y blur spread color inset;
		水平位移距離(x) 、垂直位移距離(y) 、模糊強度(blur) 、擴散強度(spread) 陰影顏色 內陰影(inset)*/
}
	#header{
		display:block;
		height:60px;
		width:100%;
	background-color:#ffffff;
		/*box-shadow:0px 4px 20px -2px #cccccc;*/	
		/*box-shadow: x y blur spread color inset;
		水平位移距離(x) 、垂直位移距離(y) 、模糊強度(blur) 、擴散強度(spread) 陰影顏色 內陰影(inset)*/
	}
#logo {
		 display:block;
		 float:left;
		 color:#333333;
		 height:60px;
		
		width:100%;

				 
		}
		#logo a{
			text-decoration:none;
			color:#333333;
		
		}
		
			#logo_2{
				
				height:60px;
			
				float:left;
			

			}
			#logo_2 img{
			height:85%;
			
			}
						
			#logo_3{
				float:right;
				width:40px;
			}
			#logo_4{
				float:right;
				width:40px;
			}
			

		#member_menu{ 
			display:block;
			float:right;
		
			line-height:40px;
			padding-top:10px;
			
			 text-align:right;
			  

			 
		}
		#member_menu a{
			text-decoration:none;
			
			color:#333333;
			
		}
		
	
		
		
	#a_menu2{
		display:none;	
		}	
		#a_content2{
		display:none;	
		}		
#a_menu {
	width:100%;
	height:517px;
	left:0;	
	top:0;
/*top:60;*/
	/*top:60px;*/
	/*position: fixed; */
	position:absolute;
	z-index:99;
	-webkit-transition: all 1s;
    -moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
	
	}	 
	#a_menu a{
		
		 text-decoration:none;
		font-size:20px;
		font-weight:bold;
		
		 color:#01497E;
		 letter-spacing:5px;
	}
	#a_menu a:hover{
	color:#669900;

						
	
	}
	#a_content{
		width:100%;
		margin:0 auto;
		text-align:center;
		height:700px;
		
	}	 
	.a_sub{ 
		display:block; 
		 font-size:18px;
		 letter-spacing:2px;
	
	background-color:#B9D6E6;
		 height:60px;
		 line-height:60px;
		 border-bottom:#FFFFFF 1px solid;
		 text-align:center;
		 color:#FFFFFF;
		width:100%;
	
	}
	.a_sub a{ 
		display:block; 
		 font-size:18px;
		 letter-spacing:2px;
	background-color:#B9D6E6;
		 height:60px;
		 line-height:60px;
		 border-bottom:#FFFFFF 1px solid;
		 text-align:center;
		 color:#FFFFFF;
		width:100%;
	
	}


/*c*/
#c_area{
	width:100%;
	position: absolute;
	top:60px;
	background-color:#FFFFFF;
	-webkit-transition: all 1s;
    -moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
	
}


#web_index{
/*	position: relative;
	overflow: hidden;

background:url(images/bg2-2.webp); 
background-repeat:no-repeat;
 background-attachment:fixed;
 background-position:center top;*/
 
	
	/*因為#TOP是FIXED等於漂浮在上, 所以BODY的DIV從#WEB開始算,上面200PX的部分會被#TOP遮住,
	 所以要加上MARGIN-TOP:200PX,把DIV往下移
	 不可使用 TOP:200PX,雖然對#WEB本身沒有影響
	 但會使#WEB下面DIV的把#WEB當作FIXed狀態而自動往上移,然後被#WEB遮住*/
}
#cfm{
	display:block;
}
#cf{
	display:none;
}

#content_main{
	
	margin:0 auto;
	/*color:#ffffff;*/
	letter-spacing:1px;
	padding:10px;
/*	background-color:rgba(0, 0, 0, 0.5);*/
}

/*2024-8-23 新INDEX*/
.index_standard1{
	/*	border-top:3px #85bed9 dashed;
	border-bottom:3px #85bed9 dashed;
*/
}
.index_standard2{
	/*	border-top:3px #85bed9 dashed;
	border-bottom:3px #85bed9 dashed;
*/
}

#index_head_mv{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	

}

#index_head_mv iframe, #index_head_mv object,#index_head_mv embed {
	position: absolute;
	
	top: 0;
	left: 0;
	
	width: 100%;
	
	height: 100%;

}
#index_head_mv2{
	position: relative;
/*	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;*/
	

}

.index_mv{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	


}

.index_mv iframe, .index_mv object,.index_mv embed {
	position: absolute;
	
	top: 0;
	left: 0;
	
	width: 100%;
	
	height: 100%;

}

#index_head_slogn_b{
margin:30px auto;
	max-width:664px;

}
#index_head_slogn_b img{
	max-width:664px;
	width:100%;
	text-align:center;
}
#index_head_slogn{
	display:none;
}

#index_area1{
	display:none;
}
#index_area1b{
	margin:30px auto;
	max-width:664px;
}
#index_area1b img{
	max-width:664px;
	width:100%;
	text-align:center;
}

#index_area2{
display:none;
}
#index_area2a{
display:none;
}

#index_area2b{
	

	margin:10px auto;
}
#index_area2b img{
	
	width:100%;
		text-align:center;
}

/*2024-8-23 新INDEX 完*/

#index_about_main{
		display:flex;
	flex-wrap:nowrap;
	flex-direction:column;
	margin-bottom:30px;
	padding:10px;
}
	#index_about_left{
		margin-bottom:10px;
		text-align:center;
		}
		#index_about_left img{
		max-width:320px;
		width:100%;
	}

		#index_about_right{
		border-top:1px #cccccc solid;
		margin-top:20px;
		
		}
.index_slogn1{
	font-size:30px;
	font-weight:bold;
	color:#FF9900;
	line-height:50px;
}
.index_slogn2{
	font-size:18px;
	line-height:30px;
	color:#003366;
}
#index_product_main{

	display:flex;
	flex-wrap:nowrap;
	flex-direction:column;

	background-color:#E6E6E6;

	
}
	#index_product_main_in{
	margin-top:20px;
	}

#index_product_kind{
padding-bottom:20px;

	display:flex;
	flex-wrap:wrap;
	flex-direction:row;


	/*background-color:#CCCCCC;*/
}
.index_kind_item{
	line-height:25px;
	width:20%;
	padding:1%;
	border-radius:10px;
/*	background-color:#996633;*/
	background-color:#6D8EAF;

	color:#ffffff;
	margin:1%;
	text-align:center;
	overflow:hidden;

}
.index_kind_item a{
	color:#ffffff;
}
#index_product_area{
/*	 background-color:#999966;*/
	border-top:1px #cccccc solid;
	padding-top:20px;

}

.index_product_content{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;

	align-items:stretch;
}

	.index_product_item{
	width:45%;
	height:auto;
	margin:2%;
	padding-bottom:20px;
	}

/*about*/

.about_btitle{
	font-size:25px;
	 color:#009999;
	font-weight:bold;
	line-height:40px;
}
.about_btitle2{
	font-size:25px;

	 color:#336699;
	font-weight:bold;
	line-height:35px;
}

.about_stitle{
	font-size:20px;
	font-weight:bold;
	color:#615693;
	
}
.about_content{
	color:#003366;
}
.alist{
	display:flex;
	flex-wrap:nowrap;
	flex-direction:column;

}
.alist_left{

  margin-bottom:10px;

}
.alist_right{
	
	align-self:strech;
	padding-left:10px;
	padding-right:10px;

	padding-bottom:20px;

}

/*3ddoll*/
#web_links{
	position: relative;
	overflow: hidden;

background:url(images/bg2-2.webp); 
background-repeat:no-repeat;
 background-attachment:fixed;
 background-position:left bottom;
 
}
.links_box{
	 
	display:block;
	margin:1%;
	 margin-bottom:30px;
	 padding-bottom:30px;
	 border-bottom:1px #E2B1DB solid;
	
	}
.links_pic_block{
	margin:0 auto;

}
.links_right_area{
	
	margin:0 auto;

}
.links_title{
		 letter-spacing:2px;
		 font-size:20px;
		 font-weight:bold;
		 margin-top:10px;
		 line-height:50px;
	}
.links_summary{
	color:#808080;
	margin-bottom:30px;
}
.links_button a{
	text-align:center;
	height:50px;
	line-height:50px;
	display:block;
	color:#ffffff;
/*	background-color:#8B5C89;*/
		background-color:#6D8EAF;
	border-radius:50px;
	margin:0 auto;
}

.article_detail_box{

	 	width:96%;
	 	margin:0 auto;
	 	

	 		padding:10px;
	 		
	 		overflow:auto;

		
	}
	.article_detail_content {
	 
	 line-height:200%;		
	}
	.article_detail_content a{
	color:#336699;
	text-decoration:underline;
	text-decoration:blink;
		
	}
.article_detail_content img{
MAX-WIDTH: 100%!important;HEIGHT: auto!important;
	width:expression(this.width > 600 ? "600px" : this.width)!important;

		
	}
*html.article_detail_content img{ 
width:expression(this.width>600&&this.width>this.height?600:auto); 

}

	.title_box{
		 letter-spacing:2px;
		 font-size:20px;
		 font-weight:bold;
		 margin-top:10px;
		

	}

	.article_detail_pic{

	 	width:96%;
	 	margin:0 auto;
	 	
	 	
	 		padding:10px;
	 		
	 		overflow:auto;

		
	}
.sdown_detail_block{
	color:#006666;
	margin-top:20px;

}
.back{
	width:200px;
	text-align:center;
	background-color:#666699;
	color:#ffffff;
	cursor:pointer;
	border-radius:20px;
	line-height:40px;
	margin-top:30px;
	margin-bottom:30px;

}
/*video*/

#video_area{

	margin:0 auto;
	text-align:center;
	
}


.video_box{
	position: relative;
	margin:20px auto;

}
.video_audio{
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
position: relative;
}

.video_audio iframe, .video_audio object,.video_audio embed {
	position: absolute;
	
	top: 0;left: 0;
	
	width: 100%;
	
	height: 100%;

}
.video_txt{
	margin-top:20px;
}


/*product*/


#product_main{

	display:flex;
	flex-wrap:nowrap;
	flex-direction:column;
	
}
#product_kind{

height:40px;


	/*background-color:#CCCCCC;*/
}

#product_area{
/*	 background-color:#999966;*/
	border-top:1px #cccccc solid;

}
.kind_area{
	
        display: -webkit-box;
         overflow-x: scroll;
          -webkit-overflow-scrolling:touch;
	padding-right:20px;
	
}
    /*去掉滾動條*/

.kind_area::-webkit-scrollbar{
	      width:0px; 
            height:0px; 

}
.kind_item{
	width:100px;
	height:25px;
	margin-right:20px;
	color:#993300;
	overflow:hidden;
}

.product_content{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	align-items:strech;
}

.product_item{
	width:45%;
	height:auto;
	margin:2%;
	padding-bottom:20px;
}
.product_pic{
	height:auto;
}

.product_pic img{
	width:100%;
}
.product_name{
	line-height:30px;
}
/*product_detail*/
#detail_content{
	padding-top:10px;
}
#detail_pic{
margin-bottom:20px;
}
#detail_pic img{
	width:100%;
}
#detail_area{
margin-bottom:20px;
	
}
#detail_memo{
	padding-top:20px;
	margin-top:20px;
		margin-left:2%;

border-top:1px #cccc solid;
	
}
#detail_memo img{
/*商品說明中的圖片限制寬度*/
	MAX-WIDTH: 100%!important;
	HEIGHT: auto!important;
	width:expression(this.width > 600 ? "100%" : this.width)!important;
		

}

/*加入購物車的提示*/
#alert_add{
	position:fixed;
	border-radius:30px;
	top:120px;
	left:8%;
	right:8%;
	padding:20px 30px;
	background:rgba(0,0,0,.6);
	color:#ffffff;
	font-size:20px;
	text-align:center;
	z-index:999;
	display:none;
}

/*member_join*/
#member_area{
	margin:0 auto;
	padding:10px;
	
}
#title_area{
	display:none;
}
#title_area2{
	width:95%;
	margin:20px auto;

		line-height:60px;

	margin-bottom:20px;
	font-size:40px;
	font-weight:bold;
	color:#6D8EAF;
		border-bottom:1px #cccccc solid;
		text-align:center;

}

#join_form{
	width:95%;
	margin:20px auto;

}

.form_space{
	display:none;
}

.input_area{
padding:10px 0;

}
.lable_box{

	text-align:left;
}
.input_box{

/*	background-color:#999966;*/
	text-align:left;
margin-top:10px;

}
.input_set{
	width:100%;
}
.input_100{
	width:100%;
}
.input_big{
	width:25px;
	height:25px;
}
/*shop_rule*/
#rule_area{
	margin:0 auto;
	padding:10px;
	
}

#rule_box{
width:95%;
	margin:20px auto;
 color:#999999;	
}

.rule_title{
	 color:#996633;
	 font-weight:bold;
	 font-size:20px;	
}
.rule_content{
 color:#333333;
}

/*member_order*/
#order_area{
	margin:0 auto;

}
#order_title{

	font-size:40px;
	font-weight:bold;
	color:#D1BEA0;
	

	line-height:60px;
	text-align:center;
	
}
#pc_order{
	display:none;
}
#mobile_order{
	display:block;
	margin-top:20px;
margin-bottom:50px;

}


/*footer*/

#footer{
	display:block;
	height:auto;

	padding-bottom:10px;

	padding-bottom:80px;
		color:#85bed9;
	
}

.link_menu{
	background-color:#85bed9;
	color:#ffffff;
	text-align:center;
		height:110px;
		padding-top:40px;
}
.sub_mlist {
	color:#ffffff;
		color:#ffffff;
	text-align:center;
	font-size:20px;

	letter-spacing:3px;
	line-height:20px;
	
}

.sub_mlist a{
	color:#ffffff;

}
.sub_mlist_br{
	display:block;
}
.dtable{
	padding-top:30px;padding-bottom:40px;padding-left:10px;padding-right:10px;
	letter-spacing:1px;

}
.dfont{
		font-size:12px;
		font-weight:bold;
}
.fleft{
	
	float:none;
	
}
.fleft img{
	width:120px;
	margin:10px;
	}

	.sub_footer{
		padding:10px;
		color:#915B3C;
		font-size:25px;
		line-height:40px;
		padding-top:20px;
	}
		.sub_footer a{
	

		color:#CAD9DD;
	/*color:#915B3C;*/

	}

	.sub_footer2{
		padding:10px;
		color:#ffffff;
		line-height:30px;

	}
	.sub_footer2 a{
		padding:10px;
		line-height:30px;
		color:#ffffff;
	}

	.sub_footer3{
		padding:10px;

		color:#cccccc;
		line-height:30px;
		
	}
	

/*always_up*/
#always_up{
/*	position:fixed;
	z-index:9999;
	left:20px;
	bottom:10px;
	height:50px;
	width:100%;
	display:block;*/
	
position:fixed;
	z-index:9999;
	right:10px;
	bottom:20px;
	width:70px;
	height:auto;
	display:block;
	
	
}
.linkicon{
	
	margin-right:0px;
	
}
.circle a{
	float:left;
	display:block;

	 background-color:#3366CC;
	color:#ffffff;
	border-radius:15px;
	border:2px #ffffff solid;

	width:30px;
	height:30px;
	text-align:center;
	vertical-align:middle;
	font-size:15px;
	font-weight:bold;
	line-height:30px;
	padding:4px;
	
		margin-right:15px;
}
.circle2 a{
	float:left;
	display:block;
	background-color:#eeaf00;
	color:#ffffff;
	border-radius:15px;
	border:2px #ffffff solid;

	width:30px;
	height:30px;
	text-align:center;
	vertical-align:middle;
	font-size:15px;
	font-weight:bold;
	line-height:30px;
	padding:4px;
		margin-right:15px;
	
}
.circle3 a{
	float:left;
	display:block;

	background-color:#FF0000;
	color:#ffffff;
	border-radius:15px;
	border:2px #ffffff solid;

	width:30px;
	height:30px;
	text-align:center;
	vertical-align:middle;
	font-size:15px;
	font-weight:bold;
	line-height:30px;
	padding:4px;
		margin-right:15px;
	
}

/*common*/
.submit_button1{
	/*background-color:#996633;*/
		background-color:#6D8EAF;
	color:#ffffff;
	cursor:pointer;
	border:none;
	border-radius:20px;
	 padding:5px 10px;
}
.button1{

	background-color:#669999;
	color:#ffffff;
	cursor:pointer;
	border:none;
	border-radius:20px;
	 padding:5px 10px;
}
.button2{


	background-color:#AFAF5F;
	color:#ffffff;
	cursor:pointer;
	border:none;
	border-radius:20px;
	 padding:5px 10px;
}
.button3{

	background-color:#BD5451;
	color:#ffffff;
	cursor:pointer;
	border:none;
	border-radius:20px;
	 padding:5px 10px;
}

