﻿@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap")
html {
	position:relative;
	width:100%;
	margin: 0; 
	overflow-x:hidden;
}

body{
	position:relative;
	width:100%;
	margin: 0; 
	overflow-x:hidden;
	font-family: "Helvetica", "Arial","LiHei Pro","STHeiti","Microsoft YaHei","Microsoft JhengHei", sans-serif;
	font-size:14px;
	font-weight:350;	
}

.clear {clear: both;}
a{text-decoration:none; border:0; color:#666;}
a:hover{color:#f27d00;}
img{border:0;}
ul{list-style:none;}


.fullimg{
	width:100%; 
	height:auto;
	margin:0; 
	padding:0; 
	text-align: center; 	
}

.fullimg img{
	width:100%; 
	height:auto;
	margin:0; 
	padding:0; 
	border:0;	
}


@media only screen and (max-width:768px){

.mfootdiv{
	position:fixed;
	display:block;
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	z-index:99999;
	bottom:0;
	right:10px;
}


.mfootdiv a{
	display:block;
	padding:4px 0;
	margin:2px 0; 
	float:right;	
}

.mfootdiv a img{
	height:40px;
	width:auto;
	padding:0; 
	margin:0 5px 0 0;
    	opacity: 0.85; 
    	filter: alpha(opacity=85);
}

.mfootdiv a img:hover{
    	opacity: 1.0; 
    	filter: alpha(opacity=100);
}


.v768u{display:none;}
.v768d{}

}
@media only screen and (min-width:768px){

.mfootdiv{
	position:fixed;
	display:block;
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	z-index:99999;
	bottom:10px;
	right:100px;
}


.mfootdiv a{
	display:block;
	padding:4px 0;
	margin:2px 0; 
	float:right;	
}

.mfootdiv a img{
	height:30px;
	width:auto;
	padding:0; 
	margin:0 5px 0 0;
    	opacity: 0.85; 
    	filter: alpha(opacity=85);
}

.mfootdiv a img:hover{
    	opacity: 1.0; 
    	filter: alpha(opacity=100);
}

.v768u{}
.v768d{display:none;}


}

/*  */

@media only screen and (max-width:768px){

.v1400u{display:none;}
.v768_1200{display:none;}
.v1200_1400{display:none;}


}

@media (min-width: 768px) and (max-width:1200px) {

.v1200_1400{display:none;}
.v1400u{display:none;}
.v768_1200{}

}

@media (min-width: 1200px) and (max-width:1400px) {

.v768_1200{display:none;}
.v1400u{display:none;}
.v1200_1400{}

}

@media only screen and (min-width:1400px){

.v1400u{}
.v768_1200{display:none;}
.v1200_1400{display:none;}


}


/* 標題 */

.colorgr{color:#a8a8a8!important;}
.colorw{color:#fff!important;}

@media only screen and (max-width:768px){

.chtitlediv{
	width:90%;
	height:auto;
	margin:20px 5%;	
	padding:0;
	font-size:18px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:0px;
	text-align:left; 
	font-family:Microsoft JhengHei;
}

.chtitlediv span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:32px;
	font-weight:300;
	color:#fff;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

.chtitlediv2{
	width:90%;
	height:auto;
	margin:0 5% 30px 5%;	
	padding:0;
	font-size:18px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:0px;
	text-align:center; 
	font-family:Microsoft JhengHei;
}

.chtitlediv2 span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:32px;
	font-weight:300;
	color:#a8a8a8;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

}

@media (min-width: 768px) and (max-width:900px) {


.chtitlediv{
	width:90%;
	height:auto;
	margin:20px 5%;	
	padding:0;
	font-size:16px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:1px;
	text-align:left; 
	font-family:Microsoft JhengHei;
}

.chtitlediv span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:26px;
	font-weight:300;
	color:#fff;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

.chtitlediv2{
	width:90%;
	height:auto;
	margin:0 5% 30px 5%;	
	padding:0;
	font-size:16px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:1px;
	text-align:center;
	font-family:Microsoft JhengHei;
}

.chtitlediv2 span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:26px;
	font-weight:300;
	color:#a8a8a8;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}


}


@media (min-width: 900px) and (max-width:1200px) {

.chtitlediv{
	width:90%;
	height:auto;
	margin:20px 5%;	
	padding:0;
	font-size:20px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:1px;
	text-align:left;
	font-family:Microsoft JhengHei; 
}

.chtitlediv span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:36px;
	font-weight:300;
	color:#fff;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

.chtitlediv2{
	width:90%;
	height:auto;
	margin:0 5% 40px 5%;	
	padding:0;
	font-size:20px;
	font-weight:700;
	color:#f00000;
	line-height: 36px;
	letter-spacing:1px;
	text-align:center;
	font-family:Microsoft JhengHei; 
}

.chtitlediv2 span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:36px;
	font-weight:300;
	color:#a8a8a8;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

}

@media (min-width: 1200px) and (max-width:1400px) {

.chtitlediv{
	width:90%;
	height:auto;
	margin:20px 5%;	
	padding:0;
	font-size:22px;
	font-weight:700;
	color:#f00000;
	line-height: 40px;
	letter-spacing:1px;
	text-align:left; 
	font-family:Microsoft JhengHei;
}

.chtitlediv span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:40px;
	font-weight:300;
	color:#fff;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

.chtitlediv2{
	width:90%;
	height:auto;
	margin:0 5% 45px 5%;	
	padding:0;
	font-size:22px;
	font-weight:700;
	color:#f00000;
	line-height: 40px;
	letter-spacing:1px;
	text-align:center;
	font-family:Microsoft JhengHei;
}

.chtitlediv2 span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:40px;
	font-weight:300;
	color:#a8a8a8;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

}

@media only screen and (min-width:1400px){

.chtitlediv{
	width:90%;
	height:auto;
	margin:20px 5%;	
	padding:0;
	font-size:26px;
	font-weight:700;
	color:#f00000;
	line-height: 48px;
	letter-spacing:1px;
	text-align:left;
	font-family:Microsoft JhengHei;
}

.chtitlediv span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:48px;
	font-weight:300;
	color:#fff;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

.chtitlediv2{
	width:90%;
	height:auto;
	margin:0 5% 50px 5%;	
	padding:0;
	font-size:26px;
	font-weight:700;
	color:#f00000;
	line-height: 48px;
	letter-spacing:1px;
	text-align:center;
	font-family:Microsoft JhengHei;
}

.chtitlediv2 span{
	margin: 0;
	padding:0 10px 0 0;
	font-size:48px;
	font-weight:300;
	color:#a8a8a8;
	font-family: 'Jost', sans-serif;
	font-family: 'Montserrat', sans-serif;
}

}




/*  */

@media only screen and (max-width:768px){

.idxabout{
	width:100%;
	height:auto;
	margin:0;	
	padding:20px 0 30px 0;
	background-image : url(../images/bg_grm.jpg); 
	background-repeat : no-repeat;
	background-position:left top;
}



.idxaboutdiv1{
	width:96%;
	height:auto;
	margin:0 2%;
	padding:10px 0 30px 0;

}

.idxaboutdiv1 img{
	width:100%;
	height:auto;	
	margin:0;	
	padding:0;
	border:0;
}

.idxaboutdiv2{
	width:90%;
	height:auto;
	margin:0 5%;
	padding:0;	
	font-size:14px;
	font-weight:300;
	color:#111;
	line-height: 25px;
	letter-spacing:1px;
	text-align:left; 	
}

.idxmore{
        width: auto;
        height:auto;
        margin: 0 0 0 5px;
        padding: 5px 15px;
        font-size: 15px !important;
        font-weight: 300 !important;
        color: #fff;
        letter-spacing: 1px;
	text-align: center;
	background:#E4040B;
}


}

@media (min-width: 768px) and (max-width:900px) {


.idxabout{
	width:100%;
	height:auto;
	margin:0;	
	padding:30px 0 40px 0;
	background-image : url(../images/bg_gr.jpg); 
	background-repeat : no-repeat;
	background-position:center top;
}



.idxaboutdiv1{
	width:96%;
	height:auto;
	margin:0 2%;
	padding:0 0 20px 0;

}

.idxaboutdiv1 img{
	width:90%;
	height:auto;	
	margin:0 5%;	
	padding:0;
	border:0;
}

.idxaboutdiv2{
	width:96%;
	height:auto;
	margin:0 2%;
	padding:0;	
	font-size:15px;
	font-weight:300;
	color:#111;
	line-height: 28px;
	letter-spacing:0px;
	text-align:left; 	
}

.idxmore{
	display:inline-block;
        width: auto;
        height:auto;
        margin: 0 0 0 5px;
        padding: 5px 15px;
        font-size: 15px !important;
        font-weight: 300 !important;
        color: #fff;
        letter-spacing: 1px;
	text-align: center;
	background:#E4040B;
}

}

@media (min-width: 900px) and (max-width:1200px) {


.idxabout{
	width:100%;
	height:auto;
	margin:0;	
	padding:60px 0 40px 0;
	background-image : url(../images/bg_gr.jpg); 
	background-repeat : no-repeat;
	background-position:center top;
}



.idxaboutdiv1{
	width:80%;
	height:auto;	
	margin:5px 10% 40px 10%;	
	padding:0;

}

.idxaboutdiv1 img{
	display:block;
	width:60%;
	height:auto;	
	margin:-60px 0 0 40%;	
	padding:0;
	border:0;
}

.idxaboutdiv2{
	width:96%;
	margin:0 2%;
	padding:0;	
	font-size:16px;
	font-weight:300;
	color:#111;
	line-height: 25px;
	letter-spacing:1px;
	text-align:left; 	
}

.idxmore{
        width: auto;
        height:auto;
        margin: 0 0 0 8px;
        padding: 5px 25px;
        font-size: 16px !important;
        font-weight: 300 !important;
        color: #fff;
        letter-spacing: 1px;
	text-align: center;
	background:#E4040B;
}


}

@media only screen and (min-width:1200px){

.idxabout{
	width:100%;
	height:auto;
	margin:0;	
	padding:80px 0 80px 0;
	background-image : url(../images/bg_gr.jpg); 
	background-repeat : no-repeat;
	background-position:center top;
}



.idxaboutdiv1{
	width:80%;
	height:auto;	
	margin:5px 10% 80px 10%;	
	padding:0;

}

.idxaboutdiv1 img{
	display:block;
	width:60%;
	height:auto;	
	margin:-60px 5% 0 35%;	
	padding:0;
	border:0;
}

.idxaboutdiv2{
	width:90%;
	margin:0 0 0 10%;
	padding:0;	
	font-size:18px;
	font-weight:300;
	color:#111;
	line-height: 36px;
	letter-spacing:1px;
	text-align:left; 	
}

.idxmore{
        width: auto;
        height:auto;
        margin: 0 0 0 8px;
        padding: 5px 25px;
        font-size: 16px !important;
        font-weight: 300 !important;
        color: #fff;
        letter-spacing: 1px;
	text-align: center;
	background:#E4040B;
}


}


.idxmore:hover{color: #E4040B;background:#FFD900;}


/*  */

@media only screen and (max-width:768px){


.idxproduct{
	width:100%;
	height:auto;
	margin:0;	
	padding:20px 0 30px 0;
	background-image : url(../images/bg_w.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxproductdiv1{
	width:90%;
	height:auto;
	margin:0 5%;	
	padding:0;	
}

.idxpditem{
	position:relative;
	width:45%;
	height:auto;
	margin:10px 1% 20px 1%;	
	padding:1%;	
	float:left;
	text-align: center;
}

.idxpditemimg{
	display: table-cell;
	vertical-align: middle;
	width:100%;
	height:40vw;
	margin:2%;	
	padding:0;
	border:1px solid #ddd;
	background: #fff;

}

.idxpditemimg img{
	width:96%;
	height:auto;
	margin:2%;	
	padding:0;
	border:0;	
}

.idxpditem span{
	display:block;
	width:96%;
	height:45px;
	margin:2%;	
	padding:0;
        font-size: 14px;
        font-weight: 300;
        color: #595959;
        letter-spacing: 0px;	
}

}

@media (min-width: 768px) and (max-width:1200px) {


.idxproduct{
	width:100%;
	height:auto;
	margin:0;	
	padding:40px 0 60px 0;
	background-image : url(../images/bg_w.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxproductdiv1{
	width:90%;
	height:auto;
	margin:0 5%;	
	padding:0;	
}

.idxpditem{
	position:relative;
	width:21%;
	height:auto;
	margin:10px 0.5% 30px 0.5%;	
	padding:1%;	
	float:left;
	text-align: center;
}

.idxpditemimg{
	display: table-cell;
	vertical-align: middle;
	width:100%;
	height:18vw;
	margin:2%;	
	padding:0;
	border:1px solid #ddd;
	background: #fff;

}

.idxpditemimg img{
	width:96%;
	height:auto;
	margin:2%;	
	padding:0;
	border:0;	
}

.idxpditem span{
	display:block;
	width:96%;
	height:45px;
	margin:2%;	
	padding:0;
        font-size: 14px;
        font-weight: 300;
        color: #595959;
        letter-spacing: 0px;	
}


}

@media only screen and (min-width:1200px){

.idxproduct{
	width:100%;
	height:auto;
	margin:0;	
	padding:80px 0 80px 0;
	background-image : url(../images/bg_w.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxproductdiv1{
	width:80%;
	height:auto;
	margin:0 10%;	
	padding:0;	
}

.idxpditem{
	position:relative;
	width:21%;
	height:auto;
	margin:10px 0.5% 30px 0.5%;	
	padding:1%;	
	float:left;
	text-align: center;
}




.idxpditemimg{
	display: table-cell;
	vertical-align: middle;
	width:100%;
	height:16vw;
	margin:2%;	
	padding:0;
	border:1px solid #ddd;
	background: #fff;

}

.idxpditemimg img{
	width:96%;
	height:auto;
	margin:2%;	
	padding:0;
	border:0;	
}

.idxpditem span{
	display:block;
	width:96%;
	height:50px;
	margin:2%;	
	padding:0;
        font-size: 16px;
        font-weight: 300;
        color: #595959;
        letter-spacing: 1px;	
}


}

.idxpditemimg:hover{
	border:1px solid #a8a8a8;
}

/*  */

@media only screen and (max-width:768px){


.idxCatalogs{
	width:100%;
	height:auto;
	margin:0;	
	padding:20px 0 30px 0;
	background-image : url(../images/bg_black.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxCatalogsdiv1{
	width:96%;
	height:auto;
	margin:0 2%;	
	padding:0;	
}

.idxdmitem{
	width:30%;
	height:auto;
	margin:10px 1%;	
	padding:0;	
	float:left;
	text-align: center; 
}

.idxdmitem img{
	width:100%;
	height:auto;
	margin:0;	
	padding:0;
	border:0;
}

.idxdmitem span{
	display:block;
	font-size:14px;
	font-weight:300;
	color:#fff;
	line-height:14px;
	letter-spacing:0px;
	padding:5px 0;
}


}

@media (min-width: 768px) and (max-width:1200px) {

.idxCatalogs{
	width:100%;
	height:auto;
	margin:0;	
	padding:40px 0 60px 0;
	background-image : url(../images/bg_black.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxCatalogsdiv1{
	width:90%;
	height:auto;
	margin:0 5%;	
	padding:0;	
}

.idxdmitem{
	width:16%;
	height:auto;
	margin:10px 2%;	
	padding:0;	
	float:left;
	text-align: center; 
}

.idxdmitem img{
	width:100%;
	height:auto;
	margin:0;	
	padding:0;
	border:0;
}

.idxdmitem span{
	display:block;
	font-size:16px;
	font-weight:300;
	color:#fff;
	line-height:16px;
	letter-spacing:0px;
	padding:5px 0;
}

}

@media only screen and (min-width:1200px){

.idxCatalogs{
	width:100%;
	height:auto;
	margin:0;	
	padding:80px 0 80px 0;
	background-image : url(../images/bg_black.jpg); 
	background-repeat : repeat;
	background-position:center top;
}

.idxCatalogsdiv1{
	width:80%;
	height:auto;
	margin:0 10%;	
	padding:0;	
}

.idxdmitem{
	width:16%;
	height:auto;
	margin:10px 2%;	
	padding:0;	
	float:left;
	text-align: center; 
}

.idxdmitem img{
	width:100%;
	height:auto;
	margin:0;	
	padding:0;
	border:0;
}


.idxdmitem span{
	display:block;
	padding:8px 0;
	font-size:18px;
	font-weight:300;
	color:#fff;
	line-height:18px;
	letter-spacing:1px;
}

}



/*  */



@media only screen and (max-width:768px){

.bnimg img{
	margin:0;
	border:0;
	width:100%;
}
.gotoTop{display:none;}

#goTop{display:none;}

.nbutton{	
	margin:3px 0;
	padding:10px;
	background-color: #D93658;
	cursor:pointer;
	color:#fff;
	font-size:1.2em;
}

.pbutton{
	width:40%;	
	margin:5px;
	padding:8px 15px;
	background-color: #6B6058;
	cursor:pointer;
	color:#fff;
	font-size:15px;
}


.pbutton:hover{color:#333;}


.pbutton2{
	border:1px solid #ccc; 
	width:40%;	
	margin:5px;
	padding:8px 15px;
	background-color: #fff;
	cursor:pointer;
	color:#888;
	font-size:15px;
	font-weight:700;
}

.pbutton2:hover{color:#333;}



.button{	
	border:1px solid #ccc; 
	margin:0;
	padding:2px;
	border-radius:8px;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	background-color: #ffffff;
	cursor:pointer;
}

.button2{	
	border:1px solid #AEB709; 


background:#CED60A;
background:linear-gradient(bottom,#CED60A 0,#AEB709 10%);
background:-moz-linear-gradient(bottom,#CED60A 0,#EB709 10%);
background:-webkit-gradient(linear,left bottom,left top,color-stop(0,#CED60A),color-stop(10%,#EB709));
	margin:0;
	padding:2px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	cursor:pointer;
}
}
@media only screen and (min-width:768px){



.gotoTop{
	position:fixed; 
	right:1%; 
	z-index:99999; 
	top:90%; 
}

.pbutton{
	width:40%;	
	margin:8px;
	padding:10px 40px;
	background-color: #6B6058;
	cursor:pointer;
	color:#fff;
	font-size:16px;
}
.pbutton:hover{color:#fff;background-color: #39332F;}

.pbutton2{
	border:1px solid #ccc; 
	width:40%;	
	margin:8px;
	padding:10px 40px;
	background-color: #fff;
	cursor:pointer;
	color:#888;
	font-size:16px;
	font-weight:700;
}

.pbutton2:hover{color:#333;}


.nbutton{	
	margin:8px 0;
	padding:10px 20px;
	background-color: #996600;
	cursor:pointer;
	color:#fff;
	font-size:1.2em;
}

.button{	
	border:1px solid #ccc; 
	margin:0;
	padding:10px;
	border-radius:8px;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	background-color: #ffffff;
	cursor:pointer;
}

.button2{	
	border:1px solid #AEB709; 
	margin:0;
	padding:10px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	cursor:pointer;

background:#CED60A;
background:linear-gradient(bottom,#CED60A 0,#AEB709 10%);
background:-moz-linear-gradient(bottom,#CED60A 0,#EB709 10%);
background:-webkit-gradient(linear,left bottom,left top,color-stop(0,#CED60A),color-stop(10%,#EB709));

}

}
.button:hover{background-color: #efefef;}

.button2:hover{background-color: #919807;color:#fff;}
.nbutton:hover{background-color: #cc9900;color:#fff;}
.regformbutton{width:100%;text-align: center;margin:10px 0;}
.regformbutton2{width:100%;text-align: right;margin:10px 0;}

.button3 {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 2px 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: 6px 12px;
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	
	font-weight:700;
	color: #fff;
	border: solid 1px #666666;
	background: #666666;
	background: -webkit-gradient(linear, left top, left bottom, from(#aaaaaa), to(#666666));
	background: -moz-linear-gradient(top,  #aaaaaa,  #666666);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#666666');
	
}
.button3:hover {
	color: #fff;
	text-decoration: none;
	border: solid 1px #f88e11;
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.button3:active {
	position: relative;
	top: 1px;
	color: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

.button4 {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 2px 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: 6px 12px;
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	
	font-weight:300;
	color: #fff;
	border: solid 1px #87A221;
	background: #87A221;
	background: -webkit-gradient(linear, left top, left bottom, from(#B3D32E), to(#87A221));
	background: -moz-linear-gradient(top,  #B3D32E,  #87A221);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#B3D32E', endColorstr='#87A221');
	
}
.button4:hover {
	color: #fff;
	text-decoration: none;
	border: solid 1px #f88e11;
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.button4:active {
	position: relative;
	top: 1px;
	color: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}

.input{border:1px solid #b8b8b8; background: #ffffff; padding: 8px 0; margin:2px 0;}

@media only screen and (max-width:768px){
.cbanner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}


.btitlediv{
	width:100%;
	height:auto; 
	padding:0;
	margin:20px 0 0 0;
	text-align: left;
}

.btitlediv2{
	width:100%;
	height:auto; 
	padding:0;
	margin:0 auto;
	letter-spacing:8px;
	line-height:28px;
	color:#333;
	font-size:16px;
	font-weight:700;
	text-align:center;
}

.btitlediv2 span{
	line-height:28px;
	color:#554430;
	font-size:25px;
	font-weight:300;
	letter-spacing:3px;
	padding:0 10px 0 0;	
	font-family: 'Prata', serif;
}



}

@media only screen and (min-width:768px){
.cbanner{
	text-align: center;
	width:1200px;
	height:auto; 
	padding:0;
	margin:0 auto;
}


.btitlediv{
	width:100%;
	height:auto; 
	padding:0;
	margin:60px 0 30px 0;
	text-align: left;
}

.btitlediv2{
	width:100%;
	height:auto; 
	padding:0;
	margin:0 auto;
	letter-spacing:10px;
	line-height:48px;
	color:#333;
	font-size:18px;
	font-weight:700;
	text-align: left;
}

.btitlediv2 span{
	line-height:48px;
	color:#554430;
	font-size:32px;
	font-weight:300;
	letter-spacing:5px;
	padding:0 10px 0 0;	
	font-family: 'Prata', serif;
}





}

.cbanner img{
	width:100%;
	padding:0;
	margin:0 auto;
}

.fbanner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0 auto;
}

.fbanner img{
	width:100%;
	padding:0;
	margin:0 auto;
}

/* index */
/* 首頁 */

@media only screen and (max-width:768px){
.indexbndiv{
	width:100%;
	height:auto;
	margin:0 auto;
	text-align:center;
	padding:10px 0 0 0; 
}

}

@media (min-width: 768px) and (max-width:1200px) {
.indexbndiv{
	width:100%;
	height:auto;
	margin:0 auto;
	text-align:center;
	padding:20px 0 0 0; 
}
}

@media only screen and (min-width:1200px){

.indexbndiv{
	width:100%;
	height:auto;
	margin:0 auto;
	text-align:center;
	padding:20px 0 0 0; 
}


}







@media only screen and (max-width:768px){

.indexbigtitle{
	width:90%;
	height:auto;
	margin:0 5%;
	text-align:center;
	margin-bottom:30px;
	padding:0 0 8px 0; 
	font-size:16px;
	line-height:60px;
	font-weight:700;
	letter-spacing:1px;
	color:#494236;
}

.indexbigtitle span{
	display:block;
	padding:0; 
	font-size:18px;
	font-weight:700;
	line-height:40px;
	letter-spacing:1px;
	color:#432A2D;
	float:left;
}

.indexbigtitle img{	
	height:40px;
	width:auto;
	padding:0 10px 0 0; 
	margin:0;		
	border:0;
	float:left;
}


.indexdxdiv{
	width:95%;
	padding:0; 
	margin:20px 2.5% 30px 2.5%;
	font-size:14px;
	line-height:28px;
	font-weight:700;
	letter-spacing:0px;
	color:#3366FF;
	text-align:center;
}

.indexdxdiv img{
	width:80%;
	height:auto;
	padding:0; 
	margin:10px 10% 0 10%;
	border:0;	
}

.indexdxdiv span{
	font-size:19px;
	color:#786E57;
	line-height:38px;
	letter-spacing:0px;
}





.indexspeclistdiv{
	width:100%;
	height:auto;
	padding:30px 0; 
	margin:20px 0 30px 0;
	background-color:#ffefd3;
}

.indexspecitem{
	width:95%;
	height:auto;
	padding:0; 
	margin:2.5%;	
	float:left;
}

.indexspecimg{
	width:95%;
	height:auto;
	padding:0; 
	margin:0 2.5%;
}

.indexspecimg img{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;
	border:0;	
}

.indexspectitle{
	width:95%;
	height:auto;
	padding:0; 
	margin:10px 2.5% 5px 2.5% ;
	font-size:22px;
	line-height:31px;
	font-weight:700;
	letter-spacing:1px;
	color:#715d54;
}

.indexspecdesc{
	width:95%;
	height:auto;
	padding:0; 
	margin:10px 2.5% 5px 2.5% ;
	font-size:16px;
	line-height:24px;
	font-weight:700;
	letter-spacing:1px;
	color:#a99063;
	word-wrap:break-word; 
	word-break:normal;
}


.newsbox{
	width:90%;
	height:auto;
	padding:0 0 10px 0; 
	margin:15px 5%;	
	border-bottom:1px solid #ccc;
}

.newsbox1{
	width:38%;
	height:auto;
	padding:0; 
	margin:0 2% 0 0;
	text-align:center; 	
	float:left;
}

.newsbox1 img{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;		
}

.newsbox2{
	width:57%;
	height:auto;
	padding:0; 
	margin:0 1% 0 2%;
	text-align:left; 
	text-align:left; 
	font-size:16px;
	line-height:21px;
	font-weight:700;
	letter-spacing:1px;
	color:#111;
	float:left;
}


.newsboxtitle{
	font-size:22px;
	line-height:25px;
	font-weight:500;
	letter-spacing:1px;
	color:#58422D;
	word-wrap:break-word; 
	word-break:normal;	
	padding:0 0 10px 0; 
}

.newsboxdesc{
	font-size:16px;
	line-height:21px;
	font-weight:350;
	letter-spacing:1px;
	color:#727272;
	word-wrap:break-word; 
	word-break:normal;
}



.indexdxdiv img{
	width:100% !important;
	height:auto !important;
	padding:0 !important; 
	margin:0 !important;
	border:0 !important;	
}


}

@media only screen and (min-width:768px){



.indexbigtitle{
	width:300px;
	height:auto;
	margin:0 auto;
	text-align:center;
	padding:40px 0 10px 0; 
	font-size:30px;
	line-height:100px;
	font-weight:700;
	letter-spacing:3px;
	color:#FF78DD;
}

.indexbigtitle span{
	display:block;
	padding:0 0 10px 10px; 
	font-size:30px;
	line-height:40px;
	font-weight:700;
	letter-spacing:10px;
	color:#432A2D;
	float:left;
}

.indexbigtitle img{	
	height:40px;
	width:auto;
	padding:0 14px 0 0; 
	margin:0 0 30px 0;		
	border:0;
	float:left;
}

.indexdxdiv{
	text-align:center;
	padding:40px 0 60px 0; 
	margin:0;
	font-size:19px;
	line-height:58px;
	font-weight:700;
	letter-spacing:3px;
	color:#111;
}

.indexdxdiv span{
	font-size:23px;
	font-weight:700;
	color:#f00000;
}



.indexspeclistdiv{
	width:100%;
	height:auto;
	padding:60px 0; 
	margin:20px 0 30px 0;
	background-color:#FF8550;
}

.indexspecitem{
	width:30%;
	height:auto;
	padding:0; 
	margin:15px 1.5%;	
	float:left;
}

.indexspecimg{
	width:95%;
	height:auto;
	padding:0; 
	margin:0 2.5%;
}

.indexspecimg img{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;
	border:0;	
}

.indexspectitle{
	width:95%;
	height:auto;
	padding:0; 
	margin:10px 2.5% 5px 2.5% ;
	font-size:22px;
	line-height:31px;
	font-weight:700;
	letter-spacing:1px;
	color:#58422D;
}

.indexspecdesc{
	width:95%;
	height:auto;
	padding:0; 
	margin:10px 2.5% 5px 2.5% ;
	font-size:16px;
	line-height:24px;
	font-weight:700;
	letter-spacing:1px;
	color:#a99063;
	word-wrap:break-word; 
	word-break:normal;
}


.newsbox{
	width:46%;
	height:auto;
	padding:0; 
	margin:15px 2%;	
	float:left;
	min-height:280px;	
}

.newsbox1{
	width:40%;
	height:auto;
	padding:0; 
	margin:0;	
	float:left;	
}

.newsbox1 img{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;		
}

.newsbox2{
	width:58%;
	height:auto;
	padding:20px 0 0 2%; 
	margin:0;	
	float:left;
	text-align:left; 
	font-size:16px;
	line-height:28px;
	font-weight:700;
	letter-spacing:1px;
	color:#111;	
}

.newsboxtitle{
	padding:5px 0; 
	font-size:22px;
	line-height:35px;
	font-weight:500;
	letter-spacing:1px;
	color:#58422D;
	word-wrap:break-word; 
	word-break:normal;
	text-align:left; 	
}

.newsboxdesc{
	font-size:16px;
	line-height:28px;
	font-weight:350;
	letter-spacing:1px;
	color:#727272;
	word-wrap:break-word; 
	word-break:normal;
	text-align:left; 
}





}


.newsbox2 a{color:#111;}


/*首頁部分*/

@media only screen and (max-width:768px){
.indexcenterleft, .indexcenterright{
	float: left;
	display: inline;
	margin: 5px;
	padding:0;
}
.indexcenterleft { width: 95%;}
.indexcenterright { width: 95%; }

.ictnewblock { 
	width:100%; 
	padding:0; 
	VERTICAL-ALIGN:top;
	margin:5px;
}
.idxpdcell{
	width:45%; 
	height:auto;
	padding:0; 
	VERTICAL-ALIGN:top;
	float:left;
	border:1px solid #ccc; 
	text-align:center; 
	margin:5px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.indextitlediv{
	width:100%;
	position:relative;
	margin:25px 0 5px 0;
	padding:0 5px;
	text-align:left;
	height:25px;
}
.indexnewscell{
	width:98%; 
	text-align:left; 
	padding:0; 
	margin:5px;
	VERTICAL-ALIGN:top;	
	word-wrap:break-word; word-break:break-all;
	height:auto;
}

.indexnewstitle{float: left; padding:10px 0; width:70%;color:#598400; height:auto; line-height:180%; font-size:1.1em;position:relative;border-bottom:1px solid #ccc;}
.indexnewstitle a{
	color:#1d1d44;;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
	font-size:1em;
	font-weight:300;
}
.indexnewstitle a:hover {color:#598400;}
.indexnewstitle img{margin: 0 5px;}
.indexnewsdate{float: left; padding:10px 0; text-align:right;width:30%;color:#e60012; height:auto; font-size:1em; line-height:120%; position:relative;
}


.idxphotoimg{
    text-align:center; 
    width: 98%; 
    height:auto;
    float: left;
    margin:3px;
}

.idxphotocell{
	width:98%; 
	padding:0; 
	VERTICAL-ALIGN:top;
	float:left;
	border:1px solid #ccc; 
	height:auto;
	text-align:center; 
	margin:5px;
}
.idxphotocell:hover {border:1px solid #333;}
.idxphotocell img{
    width:95%;
    margin:3px auto;
    text-align:center; 
}

.indexnewstitle{float: left; padding:2px 0 0 0; width:95%; color:#598400; height:25px; line-height:120%; font-size:1.1em;position:relative;border-bottom:1px solid #ccc;}
.indexnewstitle a{
	color:#1d1d44;;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
	font-size:1em;
	font-weight:300;
}

}
@media only screen and (min-width:768px){

.indexcenterleft, .indexcenterright{
	float: left;
	display: inline;
	margin: 5px 0;
	padding:0;
}
.indexcenterleft { width: 350px; text-align:left; margin: 50px 0 0 0; }
.indexcenterright { margin-left: 13px; width: 830px; }

.ictnewblock { 
	width:98%; 
	padding:0; 
	VERTICAL-ALIGN:top;
	margin:5px;
}
.idxpdcell{
	width:165px; 
	height:220px;
	padding:0; 
	VERTICAL-ALIGN:top;
	float:left;
	border:1px solid #ccc; 
	text-align:center; 
	margin:5px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.indextitlediv{
	width:100%;
	position:relative;
	margin:35px 0 15px 0;
	padding:0 5px;
	text-align:left;
	height:25px;
}
.indexnewscell{
	width:98%; 
	text-align:left; 
	padding:0; 
	margin:12px 0;
	VERTICAL-ALIGN:top;	
	word-wrap:break-word; word-break:break-all;
	height:auto;
}

.indexnewstitle{float: left; padding:10px 0 0 0; width:350px;color:#598400; height:25px; line-height:120%; font-size:1.1em;position:relative;border-bottom:1px solid #ccc;}
.indexnewstitle a{
	color:#1d1d44;;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
	font-size:1em;
	font-weight:300;
}
.indexnewstitle a:hover {color:#598400;}
.indexnewstitle img{margin: 0 5px;}
.indexnewsdate{float: left; padding:10px 0 0 0; text-align:right;width:80px;color:#e60012; height:25px; font-size:1em; line-height:120%; position:relative;border-bottom:1px solid #ccc;}

.idxphotoimg{
    text-align:center; 
    width: 277px; 
    height:200px;
    float: left;
    margin:6px;
}

.idxphotocell{
	width:290px; 
	padding:0; 
	VERTICAL-ALIGN:top;
	float:left;
	border:1px solid #ccc; 
	height:240px;
	text-align:center; 
	margin:5px 0 15px 15px;
}
.idxphotocell:hover {border:1px solid #669900;}
.idxphotocell img{
    height:180px;
    margin:6px auto;
    text-align:center; 
}

}


.idxpdleftmenut{
	margin:2px 5px;
	padding:5px 10px;
	width:95%;
	text-align:left;
	font-size:0.9em;
	background-color:#666;
	color:#fff; 
	font-weight:300;
	letter-spacing:1px;
}

.idxpdleftmenus{
	margin:5px;
	padding:5px 10px;
	width:95%;
	text-align:left;
	font-size:1.2em;
	border-bottom:1px dashed #ccc;
	color:#111; 
	font-weight:300;
	letter-spacing:1px;
	background-color: #efefef;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
}
.idxpdleftmenus a{
	font-size:1.2em;
	color:#111; 
	font-weight:300;
	letter-spacing:1px;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
}
.idxpdleftmenus:hover{background-color: #bbb; font-size:1.3em;font-weight:700;}
.idxpdleftmenus img{margin:0 5px ;}


.idxpdcell:hover {
	border:1px solid #333; 
	margin:5px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.idxpdcell img{
    max-width: 140px; 
    width: 140px; 
    width:expression(this.width > 140 ? "140px" : this.width);
    float: left;
    margin:5px;
}

.idxwitnesscell{
	width:96%; 
	height:auto;
	padding:0; 
	VERTICAL-ALIGN:top;
	border:1px solid #ccc; 
	text-align:center; 
	margin:5px;
}
.idxwitnesstitle{width:100%;font-weight:700;color:#333333; line-height:150%; font-size:1.1em;position:relative;}
.idxwitnesscell img{ 
    width: 95%; 
    margin:5px;}
.idxwitnessdesc{text-align:left;width:95%;margin:5px;color:#666; font-size:0.9em; line-height:140%; position:relative;}
.idxwitnessname{text-align:right;width:95%;margin:5px;color:#333; font-size:0.9em; line-height:140%; position:relative;}


.idxphototitle{text-align:right;width:95%;margin:5px 0px;color:#333; font-size:1em; line-height:140%; position:relative;}

.flowdivimg {
	width:100%;
	text-align:center; 
	color:#333;
	font-size:1em; 
	line-height:280%;
}
.flowdivimg span{
	color:#ff0000;
}
.flowdivimg img{
	width:100%;
	padding:0; 
	margin:0;
}

/*首頁2*/



@media only screen and (max-width:768px){
#mini-container{	
	margin: 0;
	padding: 0 1px;
	width: 100%;}
.gallery_block2 {
	margin: 0;
	padding: 0;
	width: 49%;
	height: auto;
	overflow: hidden;
	position: relative;
	border: 0px solid #ccc;
	float: left;
}
.centermargin{
	display:none;
}
#indextopdiv1 {
	position: relative;
	margin:0 0 20px 0;
	padding: 0;
	width: 100%;
	height: auto;
}
.pdtypediv{
	margin:0;
	padding:0 0 10px 0;
}
.pdtypediv2{
	width:30%;
	font-size:1.2em;
	color: #111;
	margin:1px;
	padding: 2px;
	float: left;
	line-height: 35px;
	border-right: 1px solid #bbb;
	text-align:center;
	background:#ff9900;


}
.pdtypediv2 a{color: #111;text-align:center;}


.gallery_block {
	margin: 2px;
	padding: 0;
	width: 48%;
	height: auto;
	float: left;
	overflow: hidden;
}

.gallery_block2 {
	margin: 2px;
	padding: 0;
	width: 48%;
	height: auto;
	float: left;
	overflow: hidden;
}




.btslide img {
	border: 0;
	width:100%;
	margin: 8px 3px 0 3px;
}
.btslide a {
	text-decoration: none;
	color: #fff; 
	text-align:center;
}
.btslide a:hover {
	color: #fc6;
}

.btslide .title {
	position: absolute;
	bottom: 0;
	margin: 0;
	width: 100%;
	height: 30px;
	line-height: 30px;
	color: #aa0000;
	font-size:1.6em;
	text-align:right;
	font-weight:300;
}
.btslide .title span{
	font-size:12px;
	color: #111;
}


.btslide .desc {display:none;}
.boxa{display:none;}
.sbox1w{display:none;}
.sbox2w{display:none;}

.pdtypedivby1{	color: #fff; margin:1px;background-color: #aaa;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby2{	color: #fff; margin:1px;background-color: #999;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby3{	color: #fff; margin:1px;background-color: #888;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby4{	color: #fff; margin:1px;background-color: #777;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby5{	color: #fff; margin:1px;background-color: #666;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby6{	color: #fff; margin:1px;background-color: #555;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby7{	color: #fff; margin:1px;background-color: #444;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby8{	color: #fff; margin:1px;background-color: #333;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}
.pdtypedivby9{	color: #fff; margin:1px;background-color: #222;width:31%;text-align:center;line-height: 45px;float: left;font-size:1.2em;}


.indexpddivimg{
	width:45%;
	margin:5px;
	float:left;
}

.indexpddivimg img{
	width:100%;
	margin:0 auto;
	text-align: center;	
}


.indexpddivimg3{
	width:30%;
	margin:3px;
	float:left;
}

.indexpddivimg3 img{
	width:100%;
	margin:0;
	text-align: center;	
}

.indexpddivimg4{
	width:23%;
	margin:3px;
	float:left;
}

.indexpddivimg4 img{
	width:100%;
	margin:0;
	text-align: center;	
}


}

@media only screen and (min-width:768px){
#mini-container{
	margin: 0;
	padding: 0 15px;
	width: 100%;

}

#indextopdiv1 {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 337px;
	background:url(../images/bgline_1.jpg) no-repeat left 0;
}

.indextopdiv1a {width:1130px; height:auto; margin:0 30px 0 25px;}
.pdtypediv{
	width:100%;
	margin:0;
	background-color: #fff;
	height:48px;
	padding:0;
	text-align:left;
}

.pdtypediv a{
	margin:0 20px 0 0;
	padding: 5px 15px;
	line-height: 35px;
	font-size:16px;
	font-weight:300;
	font-family: "Helvetica Neue", Helvetica, Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif;
	letter-spacing:1px;
	color:#111;	
}

.pdtypediv a:hover{
	background-color: #ffcc00;
	color:#fff;
	padding: 5px 15px;
	line-height: 35px;
}

.pdtypediv a:active{
	background-color: #ffcc00;
	color:#fff;
	padding: 5px 15px;
	line-height: 35px;
}

.pdtypediv2{
	width:24%;
	font-size:1.2em;
	color: #111;
	margin:1px;
	padding: 2px;
	float: left;
	line-height: 35px;
	border-right: 1px solid #bbb;
	text-align:center;
	background:#ff9900;


}

.pdtypediv2 a{color: #111;}


#indexrighttopdiv {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 900px;
}

.gallery_block {
	margin: 2px;
	padding: 0;
	width: 280px;
	height: 185px;
	overflow: hidden;
	position: relative;
	border: 1px solid #fff;
	float: left;
}

.gallery_block2 {
	margin: 2px;
	padding: 0;
	width: 280px;
	height: 376px;
	overflow: hidden;
	position: relative;
	border: 1px solid #fff;	
	float: left;
}
.centermargin{
	margin-right:2%;
}



.btslide img {
	border: 0;
	width:100%;
}
.btslide a {
	text-decoration: none;
	color: #fff; 
	text-align:center;
}
.btslide a:hover {
	color: #fc6;
}
.btslide ul, .btslide li {
	margin: 0;
	padding: 0;
	list-style: none;
	z-index: 1000;
}
.btslide .title {
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 0;
	width: 100%;
	height: 30px;
	line-height: 30px;
	color: #ffcc00;
	font-size:2em;
	text-align:right;
	font-weight:300;
	font-family:Helvetica, Arial, sans-serif;
	text-rendering: optimizeLegibility;
	text-transform:uppercase;
	letter-spacing:1px;
}
.btslide .title span{
	font-size:12px;
	color: #111;
}

.btslide .title p {
	width:100%;
	margin:0 auto;
	text-align:center;
	font-family:Helvetica, Arial, sans-serif;
	font-size:1.1em;
	font-weight:300;
	position: absolute;
	z-index: 1000;
}
.btslide .desc {
	position: absolute;
	bottom: 0px;
	left: 0;
	width: 100%;
	z-index: 999;
	display: none;
	overflow: hidden;
	color: #fff;
}

.btslide .desc .boxa {
	padding:200px 10px 0 10px;
	font-size: 1em;
	color: #ccc;
	z-index: 998;
	height:180px;
	color:#fff;
	line-height:20px;
	font-weight:300;
	VERTICAL-ALIGN:bottom;
}

.btslide .desc .boxa p{
	text-align:center;
	padding:0;
	margin:12px 0;
	color:#ffcc00;
	font-size:1.2em;
	font-weight:300;
}

.maskCss {
	width: 100%;
	background-color: #000;
	position: absolute;
	z-index: 997;
}
.bttxt{
	float:left;
	width:100%;
	text-align:center;
	font-size:1.2em;
	color:#464444;
	margin:30px 0 60px;
	font-family:'微軟正黑體';
}

.sbox1w{
	margin: 2px;
	padding: 0;
	width: 280px;
	height: 185px;
	overflow: hidden;
	position: relative;
	border: 1px solid #fff;
	float: left;
}

.sbox2w{
	margin: 2px;
	padding: 0;
	width: 566px;
	height: 185px;
	overflow: hidden;
	position: relative;
	border: 1px solid #fff;
	float: left;
}

.pdtypedivby1{	color: #fff; margin:2px 0;padding:0 20px;background-color: #aaa;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby2{	color: #fff; margin:2px 0;padding:0 20px;background-color: #999;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby3{	color: #fff; margin:2px 0;padding:0 20px;background-color: #888;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby4{	color: #fff; margin:2px 0;padding:0 20px;background-color: #777;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby5{	color: #fff; margin:2px 0;padding:0 20px;background-color: #666;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby6{	color: #fff; margin:2px 0;padding:0 20px;background-color: #555;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby7{	color: #fff; margin:2px 0;padding:0 20px;background-color: #444;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby8{	color: #fff; margin:2px 0;padding:0 20px;background-color: #333;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}
.pdtypedivby9{	color: #fff; margin:2px 0;padding:0 20px;background-color: #222;width:auto;text-align:center;line-height: 55px;float: left;font-size:1.3em;}


.indexpddivimg{
	position: relative; 
	width:45%;
	margin:0;
	float:left;
	height:200px;
}

.indexpddivimg img{
	width:80%;
	margin:0 auto;
	text-align: center;	
	z-index:101;
}

.indexpddivimg img:hover{
	width:90%;	
}
	


.indexpddivimg3{
	width:30%;
	margin:0;
	float:left;
	height:280px;
}

.indexpddivimg3 img{
	width:80%;
	margin:0;
	text-align: center;	
}

.indexpddivimg3 img:hover{
	width:90%;
}

.indexpddivimg4{
	width:23%;
	margin:3px;
	float:left;
}

.indexpddivimg4 img{
	width:90%;
	margin:0;
	text-align: center;	
}

.indexpddivimg4 img:hover{
	width:100%;	
}
}




.pdtypedivby1 a{color: #fff;}
.pdtypedivby2 a{color: #fff;}
.pdtypedivby3 a{color: #fff;}
.pdtypedivby4 a{color: #fff;}
.pdtypedivby5 a{color: #fff;}
.pdtypedivby6 a{color: #fff;}
.pdtypedivby7 a{color: #fff;}
.pdtypedivby8 a{color: #fff;}
.pdtypedivby9 a{color: #fff;}


.pdtypedivby1:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby2:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby3:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby4:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby5:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby6:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby7:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby8:hover{	color: #111; background-color: #CED60A;}
.pdtypedivby9:hover{	color: #111; background-color: #CED60A;}


/* 內頁 */

@media only screen and (max-width:768px){




}
@media only screen and (min-width:768px){

.modulebannerdiv{
	width:100%;
	height:auto;
	margin:0;	
	padding:0;
}

.modulebannerdiv img{
	width:100%;
	height:auto;
	margin:0;	
	padding:0;
	border:0;	
}


}



/* 公用部份 */


@media only screen and (max-width:768px){

.content{
	width:100%;
	position:relative;
	text-align: center;
	margin:0;
	
}


}
@media only screen and (min-width:768px){

.content{
	width:100%;
	position:relative;
	text-align: center;
	margin:10px 0 0 0;
	
}


}



#indexlinkdiv{
	width:100%;
	position:relative;
	text-align: center;
	margin:0;
}

.indexlinktxt{padding: 2px 10px; color:#333333; font-size:0.9em;margin:0 auto;}
.indexlinktxt a{color:#333333;}
.indexlinktxt a:hover{color:#af9c71; position:relative;top:1px; left:1px;}



.contentw{
	width:100%;
	position:relative;
	text-align: center;
	margin:0;
	background:#fff;
}

.titledivcss{
	width:100%;
	color:#524803; 
	font-size:1.6em;
	text-align: center;
	margin:10px 0 25px 0;
	padding:0;
	font-weight:700;
	font-family: Gafata;
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4;
	letter-spacing:3px;
	}


@media only screen and (max-width:768px){

.inner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}

.inner1200{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}


.inner900{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}


}

@media (min-width: 768px) and (max-width:900px) {


.inner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}

.inner1200{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}

.inner900{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}

}

@media (min-width: 900px) and (max-width:1200px) {


.inner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0;
}

.inner1200{
	width:100%;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}

.inner900{
	width:900px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}


}


@media (min-width: 1200px) and (max-width:1400px) {

.inner{
	width:100%;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}

.inner1200{
	width:1200px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}


.inner900{
	width:900px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}


}

@media only screen and (min-width:1400px){

.inner{
	width:1400px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}

.inner1200{
	width:1200px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}


.inner900{
	width:900px;
	height:auto; 
	padding:0;
	margin:0 auto;
	text-align: center;
}


}




.img100 img{
	width:100%;
	hieght:auto;
	border:0;
}


.mtop30{
	margin:30px 0 0 0;
}



/* flow */

@media only screen and (max-width:768px){



.flowleft{
	width:23%;
	height:auto;
	margin:0;
	float:left;
	text-align:center;
}


.flowright{
	width:75%;
	height:auto;
	margin:0;
	float:left;
	text-align:left;
}

.flowdiv{
	width:100%;
	height:120px;
	padding:10px 0; 
	margin:10px 0;
	border-bottom: 1px solid #ccc;
	font-size:16px;
	font-weight:300;
	color:#333;
	line-height: 32px;
	word-wrap:break-word; word-break:break-all;
}

.flow2div{
	width:95%;
	height:auto;
	padding:10px 5px; 
	margin:10px 0;
	text-align:left;
	font-size:13px;
	font-weight:300;
	color:#333;
	line-height: 22px;
	word-wrap:break-word; word-break:break-all;
}


.flownum{
	font-size:38px;
	line-height:60px;
	font-weight:700;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color:#fff;
	width:60px;
	height:60px;
	-webkit-border-radius: 30px; 
	-moz-border-radius: 30px;
	border-radius: 30px;
	background: #ddd;
	margin:0 auto;
	text-align:center;
}

.flownum:hover{background: #ccc;}





}
@media only screen and (min-width:768px){

.flowleft{
	width:20%;
	height:auto;
	margin:0;
	float:left;
	text-align:center;
}


.flowright{
	width:80%;
	height:auto;
	margin:0;
	float:left;
	text-align:left;
}

.flowdiv{
	width:100%;
	height:110px;
	padding:10px 0; 
	margin:10px 0;
	border-bottom: 1px solid #ccc;
	font-family: "Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
	font-size:16px;
	font-weight:300;
	color:#333;
	line-height: 32px;
}

.flow2div{
	width:100%;
	height:auto;
	padding:10px 0; 
	margin:10px 0;
	text-align:left;
	font-family: "Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
	font-size:13px;
	font-weight:300;
	color:#333;
	line-height: 22px;
}


.flownum{
	font-size:48px;
	line-height:80px;
	font-weight:700;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color:#fff;
	width:80px;
	height:80px;
	-webkit-border-radius: 40px; 
	-moz-border-radius: 40px;
	border-radius: 40px;
	background: #ddd;
	margin:0 auto;
	text-align:center;
}

.flownum:hover{background: #ccc;}




}



/*about區*/
@media only screen and (max-width:768px){

.aboutfullimg{
	width:94%; 
	height:auto;
	margin:0; 
	padding:0 3%; 
	text-align: center; 		
}

.SGSdiv{
	width:96%; 
	height:auto;
	margin:0; 
	padding:0 2%; 
	text-align:left;
}

.SGSdiv a{
	width:31%; 
	height:auto;
	margin:0 1%;
	padding:0; 	
	float:left;
}


}

@media (min-width: 768px) and (max-width:1200px) {

.aboutfullimg{
	width:88%; 
	height:auto;
	margin:0; 
	padding:0 6%; 
	text-align: center; 		
}

.SGSdiv{
	width:90%; 
	height:auto;
	margin:0; 
	padding:0 5%; 
	text-align:left;
}

.SGSdiv a{
	width:31%; 
	height:auto;
	margin:0 1%;
	padding:0; 	
	float:left;
}


}

@media (min-width: 1200px) and (max-width:1400px) {

.aboutfullimg{
	width:88%; 
	height:auto;
	margin:0; 
	padding:0 6%; 
	text-align: center; 		
}

.SGSdiv{
	width:90%; 
	height:auto;
	margin:0; 
	padding:0 5%; 
	text-align:left;
}

.SGSdiv a{
	width:31%; 
	height:auto;
	margin:0 1%;
	padding:0; 	
	float:left;
}


}

@media only screen and (min-width:1400px){

.aboutfullimg{
	width:78%; 
	height:auto;
	margin:0; 
	padding:0 11%; 
	text-align: center; 		
}

.SGSdiv{
	width:80%; 
	height:auto;
	margin:0; 
	padding:0 10%; 
	text-align:left;
}

.SGSdiv a{
	width:31%; 
	height:auto;
	margin:0 1%; 
	padding:0; 	
	float:left;
}



}

.SGSdiv a img{
	width:100%; 
	height:auto;
	margin:0; 
	padding:0; 
	border:0;
}

.aboutfullimg img{
	width:100%; 
	height:auto;
	margin:0; 
	padding:0; 
	border:0;	
}


/* news區 */
@media only screen and (max-width:768px){
.cell{
	width:98%; 
	text-align:center; 
	padding:0 0 10px 0; 
	margin:0 3px 10px 3px;
	VERTICAL-ALIGN:top;	
	word-wrap:break-word; word-break:break-all;
	border-bottom:1px solid #ccc;
}
.cell .contentphoto {width:240px; margin:10px 40px; text-align:center; }
.contentphoto img{width:240px; }

.contentblock{
text-align:left; 
line-height:180%; 
margin:auto; 
padding:8px 10px;
color:#2E2E2E; 
overflow:hidden;
}
}
@media only screen and (min-width:768px){
.cell{
	width:1100px; 
	text-align:center; 
	padding:10px; 
	margin:0 30px 10px 30px;
	VERTICAL-ALIGN:top;	
	word-wrap:break-word; word-break:break-all;
}
.newsimgdiv {float:left; width:240px; margin:10px 10px 10px 0; }
.newscontentdiv {float:left; width:680px; margin:10px; }
.newsdatediv {float:left; width:120px; margin:10px 0 10px 10px; }
.newsimgdiv img{   
    max-width: 140px; 
    width: 140px;
    width:expression(this.width > 140 ? "140px" : this.width); margin:10px;}


.cell .contentphoto {float:left; width:240px; margin:10px; }
.contentphoto img{   
    max-width: 140px; 
    width: 140px;
    width:expression(this.width > 140 ? "140px" : this.width);margin:5px;}

.contentblock{
text-align:left; 
line-height:180%; 
margin:auto; 
padding:8px 0;
color:#2E2E2E; 
overflow:hidden;
float:left;
}








}

.contentblock2{
text-align:left; 
line-height:180%; 
margin:auto; 
padding:8px 0;
color:#2E2E2E; 
overflow:hidden;
float:left;
width:100%;
}

@media only screen and (max-width:768px){
.newscontentdiv .title{margin:15px 0 0 0; color:#B76D00; line-height:180%; font-size:1.3em;position:relative;}
.newscontentdiv .desc{	text-align:left; color:#333; word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 0px 0 0;}
.datecss{
	font-family: 'Didot';
	text-rendering: optimizeLegibility;
	color:#b5b5b5; 
	font-size:1.4em; 
	line-height:180%; 

}
.datecss2{
	margin:0 auto; 
	text-align:center; 
	width:60px; 
	padding:0 10px;
	background:#ccc;
	color:#fff; 
	font-size:2em; 
	line-height:200%;
}
}
@media only screen and (min-width:768px){
.newscontentdiv .title{text-align:left; color:#B76D00; line-height:180%; font-size:1.4em;position:relative;}
.newscontentdiv .desc{color:#333; text-align:left; word-wrap:break-word; word-break:break-all;font-size:1.1em; line-height:180%; padding:5px 0px 0 0;}
.datecss{
	font-family: 'Didot';
	text-rendering: optimizeLegibility;
	color:#b5b5b5; 
	font-size:1.4em; 
	line-height:180%; 
}
.datecss2{
	margin:0 auto; 
	text-align:center; 
	width:50px; 
	padding:0 10px;
	background:#ccc;
	color:#fff; 
	font-size:2em; 
	line-height:160%;
}
}

@media only screen and (max-width:768px){
.contentblock .title{color:#B76D00; line-height:180%; font-size:1.3em;position:relative;}
.contentblock .red{color:#84030A; font-size:0.9em; line-height:180%; text-indent:7px;position:relative;}
.contentblock .desc{word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 0px 0 0;}
}
@media only screen and (min-width:768px){
.contentblock .title{width:800;color:#B76D00; line-height:180%; font-size:1.3em;position:relative;border-bottom:2px dotted #ccc;}
.contentblock .red{color:#84030A; font-size:0.9em; line-height:180%; text-indent:7px;position:relative;}
.contentblock .desc{width:800px;word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 0px 0 0;}
}


@media only screen and (max-width:480px){
.articlebox {margin:0 5px; width:95%;position:relative; overflow:hidden;}
.articlebox img{width: 95%; margin:5px;}
.post_date {margin:0 5px;text-align:right;color:#84030A; font-size:0.9em; line-height:180%; text-indent:7px;position:relative;}
.post_content {margin:0 5px;text-align:left;width:95%;word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 5px 0 5px;}
.contentblock2 .title{margin:0 5px; width:95%; text-align:center;  float:left;color:#B76D00; line-height:180%; font-size:1.3em;position:relative;border-bottom:1px dotted #ccc;}

}

@media only screen and (min-width:481px) and (max-width:768px){
.articlebox {margin:0 5px; width:95%;position:relative; margin:0;overflow:hidden;}
.articlebox img{   
    max-width: 480px; 
    width: 480px;
    width:expression(this.width > 480 ? "480px" : this.width);margin:5px;}
.post_date {margin:0 5px;text-align:right;color:#84030A; font-size:0.9em; line-height:180%; text-indent:7px;position:relative;}
.post_content {margin:0 5px; text-align:left;width:95%;word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 0 0 0;}
.contentblock2 .title{margin:0 5px; width:95%; text-align:center;  float:left;color:#B76D00; line-height:180%; font-size:1.3em;position:relative;border-bottom:1px dotted #ccc;}

}

@media only screen and (min-width:768px){
.articlebox {width:1200px;position:relative;margin: 0 auto; }
.post_date {text-align:right;color:#84030A; font-size:0.9em; line-height:180%; text-indent:7px;position:relative;}
.post_content {text-align:left;width:98%;word-wrap:break-word; word-break:break-all;font-size:1em; line-height:180%; text-indent:7px; padding:5px 0 0 0;}
.contentblock2 .title{margin:0; width:100%; text-align:center;  float:left;color:#B76D00; line-height:180%; font-size:1.3em;position:relative;border-bottom:1px dotted #ccc;}

}

.contentblock2 .title img{border:0 none; margin:0 0 0 15px;padding:0;}


/* 最新消息內容 */

@media only screen and (max-width:768px){


.newsctitlediv{
	width:98%;
	height:auto;
	margin:0; 
	padding:0 0 0 2%; 
	text-align:left;
	color:#333;
	line-height:40px;
	font-size:20px;
	font-weight:700;
	letter-spacing:1px;
	border-left:2px solid #ccc;
	
}

.newscdatediv{
	width:100%;
	height:auto;
	text-align:left;	
}

.newscdate1{
	width:100%;
	height:auto;
	text-align:right;
	float:left;
}

.newscdate2{
	width:98%;
	height:auto;
	padding:0 0 0 2%; 
	text-align:left;
	float:left;
	color:#595959;
	line-height:24px;
	font-size:14px;
	font-weight:300;
	letter-spacing:1px;
}

.newscdescdiv{
	width:90%;
	height:auto;
	text-align:left;
	padding:20px 5% 45px 5%;
	line-height:180%!important;
	font-size:14px;
	font-weight:300;
	letter-spacing:0px;
	color:#111;
}

.newscdescdiv img{
	width:100% !important;
	height:auto !important;
	margin:0 !important; 
	padding:10px 0 !important;
	border:0 !important;
}



}

@media (min-width: 768px) and (max-width:1200px) {

.newsctitlediv{
	width:98%;
	height:auto;
	margin:0; 
	padding:0 0 0 2%; 
	text-align:left;
	color:#333;
	line-height:40px;
	font-size:20px;
	font-weight:700;
	letter-spacing:1px;
	border-left:2px solid #ccc;
	
}

.newscdatediv{
	width:100%;
	height:auto;
	text-align:left;	
}

.newscdate1{
	width:70%;
	height:auto;
	text-align:right;
	float:left;
}

.newscdate2{
	width:30%;
	height:auto;
	padding:10px 0 0 0; 
	text-align:right;
	float:left;
	color:#595959;
	line-height:24px;
	font-size:14px;
	font-weight:300;
	letter-spacing:1px;
}

.newscdescdiv{
	width:96%;
	height:auto;
	margin:0 2%; 
	text-align:left;
	padding:20px 0 45px 0;
	line-height:180%!important;
	font-size:14px;
	font-weight:300;
	letter-spacing:1px;
	color:#111;
}


.newscdescdiv img{
	margin:0 0 10px 0!important;
	padding:10px 0!important;

}

}


@media only screen and (min-width:1200px){

.newsctitlediv{
	width:98%;
	height:auto;
	margin:0; 
	padding:0 0 0 2%; 
	text-align:left;
	color:#333;
	line-height:40px;
	font-size:20px;
	font-weight:700;
	letter-spacing:1px;
	border-left:2px solid #ccc;
	
}

.newscdatediv{
	width:100%;
	height:auto;
	text-align:left;	
}

.newscdate1{
	width:70%;
	height:auto;
	text-align:right;
	float:left;
}

.newscdate2{
	width:30%;
	height:auto;
	padding:10px 0 0 0; 
	text-align:right;
	float:left;
	color:#595959;
	line-height:24px;
	font-size:14px;
	font-weight:300;
	letter-spacing:1px;
}

.newscdescdiv{
	width:100%;
	height:auto;
	text-align:left;
	padding:20px 0 45px 0;
	line-height:180%!important;
	font-size:16px;
	font-weight:300;
	letter-spacing:1px;
	color:#111;
}


.newscdescdiv img{
	margin:0 0 10px 0!important;
	padding:10px 0!important;

}

}







/* 聯絡諮詢 */


/* contact */

@media only screen and (max-width:768px){

.contactleft{
	width:95%;
	height:auto;
	margin:0 5px;
}

.contactright{
	width:95%;
	height:auto;
	margin:0 5px;
}

.iframe1{
	width:100%; 
	height:240px;
	padding:0; 
	margin:5px 0;
}

.contactline{
	width:100%;
	text-align:center;
	font-family: Arial, sans-serif;
	font-size:  13px;
	letter-spacing:1px;
	color:#333;
	margin:25px 0 0 0;
}


}
@media only screen and (min-width:768px){

.contactleft{
	width:70%;
	height:auto;
	float:left;
	margin:20px 0 0 0;
}

.contactright{
	width:30%;
	height:auto;
	float:left;
	margin:20px 0 0 0;
}

.iframe1{
	width:95%; 
	height:320px;
	padding:0; 
	margin:10px;
}

.contactline{
	width:100%;
	text-align:center;
	font-family: Arial, sans-serif;
	font-size:  13px;
	letter-spacing:1px;
	color:#333;
}



}




@media only screen and (max-width:768px){

.mformdiv1100 {
	background-color:#fff; 
	width: 95%;
	height:auto;
	margin:0 7px;
	padding: 0 0 15px 0;
}

.mformdiv {
	background-color:#fff; 
	width: 95%;
	height:auto;
	margin:0 7px;
	padding: 0 0 15px 0;
}

.mformtitle {
	width: 95%;
	text-align:left;
	margin:5px 0 0 0;
	padding:10px 8px 0 8px;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	line-height:28px;
}
.mformtxt {
	width: 95%;
	margin:5px 0 0 8px;
	letter-spacing:2px;
	line-height:28px;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
}

.mformtitle2 {
	width: 95%;
	text-align:left;
	padding:10px 8px 0 8px;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	background-color:#eee;
	border-bottom: 1px solid #a8a8a8; 
	line-height:28px;
}
.mformtxt2 {
	width: 95%;
	margin:5px 0 0 8px;
	letter-spacing:2px;
	line-height:40px;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
}

.mformtitle3 {
	width: 95%;
	text-align:left;
	margin:5px 0 0 0;
	padding:10px 8px 0 8px;
	font-family: Arial, sans-serif;
	font-size:  14px;
	letter-spacing:0px;
	color:#333;
	line-height:28px;
}
.mformtxt3 {
	width: 95%;
	margin:5px 0 0 8px;
	letter-spacing:2px;
	line-height:28px;
	font-family: Arial, sans-serif;
	font-size:  14px;
	text-align:left;
	color:#005A87;
}

.mformtitle1100 {
	width: 100%;
	text-align:left;
	padding:5px 0 0 0;
	font-family: Arial, sans-serif;
	font-size:  13px;
	letter-spacing:1px;
	color:#333;
	line-height:22px;
	margin:10px 0 0 0;
}
.mformtxt1100 {
	width: 100%;
	letter-spacing:1px;
	line-height:150%;
	font-family: Arial, sans-serif;
	font-size:  13px;
	text-align:left;
	margin:0 0 10px 0;
}


.formbutton{
	width: 100%;
	text-align:center;
	margin:5px 0 30px 0;
}

.formbutton2{
	width: 100%;
	text-align:center;
	margin:5px 0 30px 0;
}

}

@media only screen and (min-width:768px){
.mformdiv1100 {
	background-color:#fff; 
	width: 1100px;
	height:auto;
	margin:0;
	padding: 0 0 15px 0;
}

.mformdiv {
	background-color:#fff; 
	width: 100%;
	height:auto;
	margin:0;
	padding: 0 0 15px 0;
}

.mformtitle {
	width: 30%;
	float: left;
	text-align:right;
	padding:5px 0;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	line-height:22px;
	margin:5px 0;
}


.mformtxt {
	width: 70%;
	float: left;
	letter-spacing:1px;
	line-height:150%;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
	margin:5px 0;
}

.mformtitle2 {
	background-color:#eee; 
	width: 30%;
	float: left;
	text-align:right;
	padding:2px 0;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	line-height:40px;
	margin:2px 0;
	border-bottom: 1px dashed #ccc;
}
.mformtxt2 {
	background-color:#f8f8f8; 
	width: 68%;
	float: left;
	letter-spacing:1px;
	padding:2px 0 2px 10px;
	line-height:40px;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
	margin:2px 0;
	border-bottom: 1px dashed #ccc;
}


.mformtitle3 {
	width: 22%;
	float: left;
	text-align:right;
	padding:5px 0;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	line-height:22px;
	margin:5px 0;
}

.mformtitle3 span{
	display:inline-block;
	width:75px;
	padding:0 10px 0 0;
}

.mformtxt3 {
	width: 65%;
	float: left;
	letter-spacing:1px;
	line-height:150%;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
	margin:5px 0;
}


.mformtitle1100 {
	width: 330px;
	float: left;
	text-align:right;
	padding:5px 20px 5px 0;
	font-family: Arial, sans-serif;
	font-size:  15px;
	letter-spacing:1px;
	color:#333;
	line-height:22px;
	margin:10px 0;
}
.mformtxt1100 {
	width: 750px;
	float: left;
	letter-spacing:1px;
	line-height:150%;
	font-family: Arial, sans-serif;
	font-size:  15px;
	text-align:left;
	margin:10px 0;
}

.formbutton{
	width: 100%;
	text-align:center;
	margin:5px 0 30px 0;
}

.formbutton2{
	width: 100%;
	text-align:right;
	margin:5px 0 30px 0;
}

}


.mformview2{
	background: #ccc;
	width:100%;
	height:40px;		
}


@media only screen and (max-width:768px){


.txtinput1b {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.txtinput2b {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.txtinput3b {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.nbutton{	
	margin:3px 0;
	padding:10px 8px;
	background-color: #e16106;
	cursor:pointer;
	color:#fff;
	font-size:16px;
	font-weight:300;
	border: 0;
}

.nbutton:hover{	
	background-color: #ccc;
	color:#333;
	font-weight:300;
}



}

@media only screen and (min-width:768px){


.txtinput1b {
color: #333;
padding: 5px 8px;
background: #fff;
width: 100%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput2b {
color: #333;
padding: 5px 8px;
background: #fff;
width: 55%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput3b {
color: #333;
padding: 5px 8px;
background: #fff;
width:35%;
border:1px solid #ccc; 
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.nbutton{	
	margin:3px 0;
	padding:10px 25px;
	background-color: #e16106;
	cursor:pointer;
	color:#fff;
	font-size:16px;
	font-weight:300;
	border: 0;
}

.nbutton:hover{	
	background-color: #F97615;
	font-weight:300;
}



}



@media only screen and (max-width:768px){
.txtinput {
color: #b0b0b0;
padding: 8px 13px;
background: #fff;
width: 95%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}


.txtinput1 {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.txtinput2 {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.txtinput3 {
color: #333;
padding: 5px 0;
background: #fff;
width: 100%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
clear: both;
}

.txtinput0 {
color: #333;
padding: 5px 3px;
margin:0 3px 5px 0;
background: #fff;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

}
@media only screen and (min-width:768px){


.txtinput {
color: #b0b0b0;
padding: 8px 13px;
background: #fff;
width: 95%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}


.txtinput1 {
color: #333;
padding: 5px 8px;
background: #fff;
width: 100%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput2 {
color: #333;
padding: 5px 8px;
background: #fff;
width: 55%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput3 {
color: #333;
padding: 5px 8px;
background: #fff;
width:35%;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput0 {
color: #333;
padding: 5px 3px;
margin:0 3px 0 0;
background: #fff;
border: none;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

}



.ntxtinput {
color: #333;
padding: 5px 8px;
background: #fff;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}


.ntxtinput2 {
color: #b0b0b0;
padding: 8px 13px;
background: #fff;
width: 55%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput3 {
color: #b0b0b0;
padding: 8px 13px;
background: #fff;
width: 25%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}


.txttextarea {
color: #b0b0b0;
border: none;
padding: 8px 13px;
width: 95%;
height: 230px;
position: relative;
resize: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
margin: 0;
}


.txttextareab {
color: #333;
border:1px solid #ccc; 
padding: 8px 13px;
width: 100%;
height: 60px;
position: relative;
resize: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
margin: 0;
background: #fff;
}


.ntxtinput9 {
color: #595959;
padding: 8px 13px;
margin:0 3px 5px 0;
background: #fff;
width: auto;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}


/* 商品內頁 */
@media only screen and (max-width:768px){
.product{
	width:96%;
	margin:20px 2% 0 2%;
}

.pdimg{
	width:95%;
	float:left;
	padding:0 10px 0 5px;
}

.showbox img{
	width:95%;
	margin:3px;
}
.showsmall{
	margin-top: 10px;
	width: 100%;
	overflow: hidden;
}

.pdspicdiv {
	width: 23%;
	border: 1px solid #CCC;
	height: auto;
	float:left;
	margin:1px;
}
.pdspicdiv a img {
	width: 95%;
	display:table-cell;
	vertical-align:middle;
	margin:1px;
}

.product .text {width:95%;float:right;font-family:Verdana, Geneva, sans-serif; font-size:1.1em; padding-right:10px;text-align:left; }
.product .text2 {display:none; }
.product .text3 {width:95%;float:right;font-family:Verdana, Geneva, sans-serif; font-size:1.1em; padding-right:10px;text-align:left; }



}
@media only screen and (min-width:768px){
.product{
	width:100%;
	margin:0 auto;
}

.pdimg{
	width:520px;
	float:left;
	padding:0px 10px 0 5px;
}

.showbox img{
	width:96%;
	height:auto;
	margin:20px 2% 10px 2%;
	padding:0;
}
.showsmall{
	margin-top: 10px;
	width: 100%;
	height: auto;
}

.pdspicdiv {
	width: 100px;
	border: 3px solid #efefef;
	height: 80px;
	float:left;
	margin:5px;
	line-height:100px;
	text-align:center;
}
.pdspicdiv a img {
	display:table-cell;
	vertical-align:middle;
	margin:3px auto;
}

.product .text {
	width:420px;
	float:left;
	font-family:Verdana, Geneva, sans-serif; 
	font-size:1.1em; 
	padding-right:10px;
	text-align:left; 
}

.product .text2 {
	width:420px;
	height:auto;
	float:left;
	padding:30px 0 0 5px;
	text-align:left; 
}

.product .text3 {display:none; }

}

.productcell .keyno{ 
	font-size:1.3em; 
	line-height:180%; 
	position:relative;
	color:#f27d00;
	text-align:right;
	padding-right:5px;
}

.text .keyno{ font-size:18px; line-height:180%; position:relative;color:#C32700;}
.text .title{
	font-size:16px; 
	line-height:150%;
	color:#333;
}
.text .code{ font-size:16px; line-height:180%; position:relative;}

.text2 .keyno{ font-size:20px; line-height:32px; font-weight:700;position:relative;color:#C32700;padding:10px 0;}
.text2 .title{
	font-size:16px; 
	line-height:150%;
	color:#333;
}
.text2 .reprice{ 
	font-size:16px; 
	line-height:150%;
	color:#333;
 }
.text2 .price{ min-height:80px;font-size:18px;  font-weight:300; line-height:28px; position:relative; color:#C32700; }
.text2 .price span{ font-size:16px; line-height:28px; font-weight:300; position:relative; color:#666; }
.text2 .stocks{ font-size:16px; line-height:28px; position:relative; color:#900000; }
.text2 .stocks span{ font-size:16px; line-height:28px;position:relative; color:#333; }
.text2 .about{ 
	margin:10px 0px;
	padding:10px 0;
	font-size:16px; 
	line-height:150%;
	color:#333; 
	border-top:1px solid #ccc; 
}

.text3 .keyno{ font-size:18px; line-height:150%; position:relative;color:#C32700;padding:10px 0;}
.text3 .title{
	font-size:16px; 
	line-height:150%;
	color:#333;
}
.text3 .reprice{ 
	font-size:16px; 
	line-height:150%;
	color:#333;
}
.text3 .price{ font-size:18px; line-height:28px; font-weight:300; position:relative; color:#C32700; }
.text3 .price span{ font-size:16px; line-height:28px;position:relative; color:#666; }
.text3 .stocks{ font-size:16px; line-height:28px; position:relative; color:#900000; }
.text3 .stocks span{ font-size:16px; line-height:28px;position:relative; color:#333; }
.text3 .about{ 
	margin:10px 0px 35px 0;
	padding:10px 0;
	font-size:16px; 
	line-height:150%;
	color:#333; 
	border-top:1px solid #ccc; 
}

.product .text .itemBox{margin-top:10px;color:#555;font-size:0.9em; padding-bottom:20px; border-top:double 1px#dededc;}
.product .text .item{line-height:30px; margin:5px 0;}
.product .text .item .list{width:75px;float:left; line-height:160%;; padding-top:5px\9; color:#000;}

.list_text{margin-left:75px;line-height:160%; text-align:left;}
.list_text2{text-align:left; margin:10px;}
.list_text2 img{width:100%;height:auto;border:0;}
.product .Sale{color:#990000;font-size:1.2em; margin-left:5px; margin-right:10px;font-weight:bold;}
.product .page{ text-align:right; padding-top:5px;}


.shoppingcar{
	width:100%;
	text-align:right;
	margin:10px 0px;
}

/* 商品統一說明區 */

.shoppingdesc{
	width:100%;
	margin:0 auto;
}

.pdmenudiv {
	width:100%;
	padding:0px;
	margin: 20px 0 0 0;
}

@media only screen and (max-width:768px){

.flowdesc{
	width:100%;
	margin:0 auto;
}

.shoppingdesc .img{
	width:20%;
	float:left;
	margin:0 auto;
	text-align: right;
}

.shoppingdesc .img img{
	width:100%;
	margin:0;
}

.shoppingdesc .contact{
	width:78%;
	float:left;
	text-align: left;
	margin:5px 0 15px 0;
	
}
.pdmenudivimg { width:24%;
		  padding:0px;
		  margin:10px 1px;
		  float:left;
}
}

@media only screen and (min-width:768px){
.flowdesc{
	width:1100px;
	margin:0 auto;
	text-align: center;
}

.shoppingdesc .img{
	width:10%;
	float:left;
	margin:0 auto;
	text-align: left;
}

.shoppingdesc .img img{
	width:60px;
	margin:0 10px 15px 0;
}

.shoppingdesc .contact{
	width:83%;
	float:left;
	text-align: left;
	margin:5px 0 15px 0;
	
}
.pdmenudivimg { width:31%;
		  padding:0px;
		  margin:10px 2px;
		  float:left;
}
}


.shoppingdesc .contact .title{ font-size:1.2em; color:#666;margin:5px 0;}
.shoppingdesc .contact .desc{ font-size:1em; color:#666;}






.pdmenudivimg img{width:95%; margin:3px;}


/* 購物車 */

@media only screen and (max-width:768px){

.Odtitle{ 
	width:98%; 
	margin:0 1%;
	padding:5px 0;
	height:auto; 
	font-size:12px; 
	border-bottom:1px solid #595959;
}

.Odtitle2{ 
	width:98%; 
	margin:0 1%; 
	font-size:12px; 
	height:auto; 
	border-bottom:1px solid #ededed; 
	padding:5px 0; 
}

.Odtitle2 input{ margin-top:35px;margin-top:0px\9;}
.odproduct{ line-height:30px; margin-top:10px;}
.oditem20{float:left; width:20%; }

.pdimgitem{ display:none; }
.pdimgitem img{ display:none; }
.oditem55{float:left; width:100%;text-align:center;line-height:28px;background:#f8f8f8;padding:5px 0;}
.oditem35{float:left; width:100%;text-align:center;line-height:28px;background:#f8f8f8;padding:5px 0;}
.oditem30{float:left; width:100%;text-align:center;line-height:28px;background:#f8f8f8;padding:5px 0;}
.oditem15{float:left; width:20%;text-align:center;padding:5px 0;line-height:30px;}
.oditem15 input{ width:50px; height:30px; border:1px solid #c2c2c2; background:#eee;}
.oditem10 {float:left; width:20%; text-align:center;padding:5px 0;line-height:30px;}
.oditem10 img{ width:80%; height:auto;}
.oditem10 input{width:80%; height:30px; border:1px solid #c2c2c2;background:#eee;margin-top:0;}
.oditem10 .Delete{ display:block; width:37px; height:37px;background:url(../images/Delete_icon.gif) no-repeat;text-indent:-199999px; margin:0 0 0 5px;}
.oditem10 .Delete:hover{ background:url(../images/Delete_icon-hover.gif) no-repeat;}
.oditem10n {float:left; width:20%; padding:0;}
.oditem10n input{width:80%; height:30px; border:1px solid #c2c2c2;background:#eee;margin-top:0;}

.TotalBox01 .left{ width:95%; padding:10px 5px;}
.TotalBox01 .right{ width:95%; height:auto; line-height:30px; padding:10px 5px;}

.TotalBox {
    width: 100%;
    height: 72px;
    background: #ededed;
    line-height: 24px;
    padding: 14px 0;
    font-family: Verdana, Geneva, sans-serif;
}

.Total {
    clear: both;
}

.Total1, .Total2, .Total3 {
    float: right;
    font-size: 12px;
    font-weight: bold;
    text-align: right;
}

.Total3 {
    width: 45px;
    margin-right: 55px;
    font-family: Verdana, Geneva, sans-serif;
}

.Total2 {
    width: 120px;
}

.Total1 {
    width: 100px;
}

.TotalBox2 {
    line-height: 50px;
    color: #900000;
    clear: both;
    font-family: Verdana, Geneva, sans-serif;
}


.TotalBox01 {
    border-bottom: 2px solid #7a7979;
    border-top: 2px solid #7a7979;
    font-size: 12px;
    line-height: 21px;
    color: #7a7979;
    font-family: Verdana, Geneva, sans-serif;
    margin: 20px 0;
}

    .TotalBox01 .left {
        width: 400px;
        float: left;
        padding: 10px 0;
        padding-left: 20px;
    }

    .TotalBox01 .rigjht {
        width: 400px;
        height: 130px;
        float: right;
        line-height: 30px;
    }

        .TotalBox01 .rigjht .ps {
            margin-left: 85px;
            padding-left: 32px;
        }

.TtBox02 {
    font-size: 12px;
    line-height: 18px;
    font-family: Verdana, Geneva, sans-serif;
    margin: 5px 0;
}

}

@media only screen and (min-width:768px){

.Odtitle{ height:50px; line-height:50px; font-size:12px; border-bottom:7px solid #efefef;}
.Odtitle{ width:100%; font-size:12px; clear:both; font-family:Verdana, Geneva, sans-serif;}
.Odtitle2{ width:100%; font-size:12px; clear:both; font-family:Verdana, Geneva, sans-serif; height:100px; border-bottom:1px solid #ededed; padding:5px 0; line-height:100px; }
.Odtitle2 input{ margin-top:35px;margin-top:0px\9;}
.odproduct{ line-height:30px; margin-top:10px;}
.oditem20{float:left; width:20%; }


.pdimgitem{ width:20%; float:left; }
.pdimgitem img{ height:90px; padding:3px; }
.oditem55{float:left; width:55%;line-height:30px;margin-top:20px}
.oditem35{float:left; width:35%;line-height:30px;margin-top:20px}
.oditem30{float:left; width:30%;line-height:30px;margin-top:20px}
.oditem15{float:left; width:15%;text-align:center;line-height:30px;margin-top:20px}
.oditem15 input{ width:50px; height:30px; border:1px solid #c2c2c2; line-height:30px; text-align:center; margin-top:10px;}
.oditem10 {float:left; width:10%; text-align:center;line-height:30px;margin-top:20px}
.oditem10 img{ width:70px; height:70px;}
.oditem10 input{ width:50px; height:30px; border:1px solid #c2c2c2; line-height:30px; text-align:center; margin-top:0;}
.oditem10 .Delete{ display:block; width:37px; height:37px;background:url(../images/Delete_icon.gif) no-repeat;text-indent:-199999px; margin:0 0 0 30px;}
.oditem10 .Delete:hover{ background:url(../images/Delete_icon-hover.gif) no-repeat;}
.oditem10n {float:left; width:10%; text-align:center;line-height:30px;margin-top:20px}
.oditem10n input{width:50px; height:30px; border:1px solid #c2c2c2; line-height:30px; text-align:center; margin-top:0;background:#eee;}

.TotalBox01 .left{ width:400px; float:left; padding:10px 0; padding-left:20px;}
.TotalBox01 .right{ width:400px; height:130px; float:right; border-left:1px solid #7a7979;line-height:30px;}



.TotalBox {
    width: 100%;
    height: 72px;
    background: #ededed;
    line-height: 24px;
    padding: 14px 0;
    font-family: Verdana, Geneva, sans-serif;
}

.Total {
    clear: both;
}

.Total1, .Total2, .Total3 {
    float: right;
    font-size: 12px;
    font-weight: bold;
    text-align: right;
}

.Total3 {
    width: 45px;
    margin-right: 55px;
    font-family: Verdana, Geneva, sans-serif;
}

.Total2 {
    width: 120px;
}

.Total1 {
    width: 100px;
}

.TotalBox2 {
    line-height: 50px;
    color: #900000;
    clear: both;
    font-family: Verdana, Geneva, sans-serif;
}


.TotalBox01 {
    border-bottom: 2px solid #7a7979;
    border-top: 2px solid #7a7979;
    font-size: 12px;
    line-height: 21px;
    color: #7a7979;
    font-family: Verdana, Geneva, sans-serif;
    margin: 20px 0;
}

    .TotalBox01 .left {
        width: 400px;
        float: left;
        padding: 10px 0;
        padding-left: 20px;
    }

    .TotalBox01 .rigjht {
        width: 400px;
        height: 130px;
        float: right;
        border-left: 1px solid #7a7979;
        line-height: 30px;
    }

        .TotalBox01 .rigjht .ps {
            background: url(../images/shopping/ps.gif) 10px 55px no-repeat;
            margin-left: 85px;
            padding-left: 32px;
        }

.TtBox02 {
    font-size: 12px;
    line-height: 18px;
    font-family: Verdana, Geneva, sans-serif;
    margin: 5px 0;
}




}






.shopbutton {
        width: 49%;
        height: auto;
        margin: 5px 1% 5px 0;
        padding: 7px 0;
        color: #111;
        font-family: 'Noto Sans TC', sans-serif;
        font-size: 15px;
        font-weight: 700;
        background-color: #eee;
        border: 0;
        cursor: pointer;
	float:left;
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;
	border-radius: 5px;

}

.shopbutton:hover {background-color: #ccc;}

.shopbutton2 {
        width: 49%;
        height: auto;
        margin: 5px 0 5px 1%;
        padding: 7px 0;
        color: #fff;
        font-family: 'Noto Sans TC', sans-serif;
        font-size: 15px;
        font-weight: 700;
        background-color: #a8a8a8;
        border: 0;
        cursor: pointer;
	float:left;
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px;
	border-radius: 5px;

}

.shopbutton2:hover {background-color: #595959;}




@media only screen and (max-width:768px){


.contactformtitle {
	width: 95%;
	margin: 0 2.5%;
	text-align:left;
	padding:10px 5px;
	font-size:  16px;
	letter-spacing:1px;
	color:#512F09;
	font-weight:700;
}
.contactformtxt {
	width: 95%;
	margin: 0 2.5%;
	text-align:left;
	font-size:  16px;
	line-height:32px;
	letter-spacing:0px;
	color:#111;	
	font-weight:700;
}



.inputddl {
color: #595959;
margin:2px 2px 2px 0;
padding: 8px 13px;
background: #fff;
width: auto;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput {
color: #595959;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 95%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput2 {
color: #595959;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 60%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput3 {
color: #595959;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 60%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput {
color: #333;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 95%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput2 {
color: #333;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 55%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput3 {
color: #333;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 25%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}



}

@media only screen and (min-width:768px){


.contactformtitle {
	width: 18%;
	float: left;
	text-align:right;
	padding:10px 5px;
	font-size:  16px;
	letter-spacing:1px;
	color:#512F09;
	font-weight:700;
}
.contactformtxt {
	width: 80%;
	float: left;
	margin:5px 0;
	text-align:left;
	font-size:  16px;
	line-height:32px;
	letter-spacing:1px;
	color:#111;	
	font-weight:700;
}



.inputddl {
color: #595959;
margin:0 2px 0 0;
padding: 8px 13px;
background: #fff;
width: auto;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput {
color: #595959;
padding: 8px 13px;
background: #fff;
width: 95%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput2 {
color: #595959;
padding: 8px 13px;
background: #fff;
width: 55%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.txtinput3 {
color: #595959;
padding: 8px 13px;
background: #fff;
width: 25%;
border: 1px solid #ccc;
height: 36px;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput {
color: #333;
padding: 8px 13px;
background: #fff;
width: 95%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput2 {
color: #333;
padding: 8px 13px;
background: #fff;
width: 55%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

.ntxtinput3 {
color: #333;
margin: 2px 0;
padding: 8px 13px;
background: #fff;
width: 25%;
border: none;
height: 36px;
font: 13px/18px Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}



}



.radiocss label
{
 margin-right: 8px;
 padding-left: 4px;
}

.contacttitle{width: 100%; line-height:180%; margin:5px 0 0 0; text-align:center; color:#B76D00;  font-size:1.1em;position:relative;font-weight:300;}
.contacttitle span{color:#B76D00;  font-size:1.1em;font-weight:700;}
.contactaddr{text-align:left;color:#333333;width:100%;word-wrap:break-word; word-break:break-all;font-size:1.2em; line-height:180%;}

#contactform {
position: relative;
background-color:#eeeeee; 
width: 100%;
}




.txttextarea {
color: #b0b0b0;
border: none;
padding: 8px 13px;
width: 95%;
height: 230px;
position: relative;
resize: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
float: left;
font: 13px/18px Arial, Helvetica, sans-serif;
margin: 0;
}

.contactformbutton {
width: 100%;
height: 50px;
margin:10px 0;
}


/* 中間區塊 */

/*  */
@media only screen and (max-width:768px){

.contentdiv{
	width: 100%;
	height: auto;
	margin:0;
	padding:0;


}



}

@media only screen and (min-width:768px){

.contentdiv{
	width:100%;
	height: auto;
	margin:0;
	padding:0;
	min-height:500px;

}



}





/* page區 */

#pager{
		padding: 3px;
		margin: 3px;
		text-align:center;
		font-family:Tahoma,Helvetica,sans-serif;
		font-size:1.1em;
}
#pager a{		
	border: 1px solid #aeaeae;
	margin-right:3px;
	padding:2px 8px;
	background-position:bottom;
	text-decoration: none;
	color: #616161;	}
#pager a:hover, #pager a:active {
	border: 1px solid #666;
	background-image:none;
	background-color:#666;
	color: #fff;
}




/* footer區 */
/*  */

@media only screen and (max-width:768px){

#foot{
	width: 100%;
	position:relative;
	text-align: center;
	margin:0;
	padding:15px 0 25px 0;
	height:auto;
	background:#020000;
	background-image : url(../images/bg_redsm.jpg); 
	background-repeat : no-repeat;
	background-position:center top;

}


}

@media (min-width: 768px) and (max-width:1200px) {

#foot{
	width: 100%;
	position:relative;
	text-align: center;
	margin:0;
	padding:35px 0 25px 0;
	height:auto;
	background:#020000;
	background-image : url(../images/bg_red.jpg); 
	background-repeat : no-repeat;
	background-position:center top;
}



}

@media only screen and (min-width:1200px){

#foot{
	width: 100%;
	position:relative;
	text-align: center;
	margin:0;
	padding:45px 0 30px 0;
	height:auto;
	background:#020000;
	background-image : url(../images/bg_red.jpg); 
	background-repeat : no-repeat;
	background-position:center top;
}



}







@media only screen and (max-width:768px){


.footeritem{
	width: 90%; 
	font-size:12px;
	line-height:21px;
	font-weight:300;
	color:#fff;
	margin:0 5%; 
	padding:0; 
	letter-spacing:0px;
	text-align: center; 
}


.footeritem a span{
	font-size:12px;
	font-weight:300;
	color:#fff;
	letter-spacing:0px;
}

.footeritem a{
	font-size:12px;
	font-weight:300;
	color:#fff;
	letter-spacing:0px;
	padding:0; 
}

.footeritem a img{
	height:auto;
	width:70%;
	margin:20px 15%; 
	padding:0;
	border:0;	
}


.footeritem2{
	width: 96%;
	height:auto;
	margin:0 2%; 
	padding:0; 
	
}



.footeritem3{
	width: 96%;
	height:auto;
	text-align: center; 
	margin:10px 2%; 
	padding:0; 
	color:#a8a8a8;
	font-size:12px;
	font-weight:300;
	text-align: center; 
	letter-spacing:0px;
	font-family: 'Noto Sans', sans-serif;
}

.footeritem3 a{color:#ccc;}
.footeritem3 a:hover{color:#fff;}


.sharediv{
	width: 100%;
	height:auto;
	text-align:center; 
	margin:10px 0 10px 0; 
	padding:0; 
}

.sharediv a img{
	width:36px;
	height:auto;
	margin: 0 3px 0 0 ; 
	padding:0;	
}



}


@media (min-width: 768px) and (max-width:1200px) {


.footeritem{
	width: 38%; 
	font-size:14px;
	line-height:25px;
	font-weight:300;
	color:#fff;
	margin:0 0 0 2%; 
	padding:0; 
	letter-spacing:1px;
	text-align: left; 
	float:left;
}


.footeritem a span{
	font-size:14px;
	font-weight:300;
	color:#fff;
	letter-spacing:1px;
}

.footeritem a{
	font-size:14px;
	font-weight:300;
	color:#fff;
	letter-spacing:1px;
	padding:0; 
}

.footeritem a img{
	height:65px;
	width:auto;
	margin:30px 0 20px -8px; 
	padding:0;
	border:0;	
}




.footeritem2{
	float:left;
	width: 60%;
	height:auto;
	margin:0; 
	padding:30px 0 0 0; 
	
}



.footeritem3{
	width: 100%;
	height:auto;
	text-align: center; 
	margin:30px 0 20px 0; 
	padding:0; 
	color:#a8a8a8;
	font-size:14px;
	font-weight:300;
	text-align: center; 
	letter-spacing:1px;
	font-family: 'Noto Sans', sans-serif;
}

.footeritem3 a{color:#ccc;}
.footeritem3 a:hover{color:#fff;}


.sharediv{
	width: 100%;
	height:auto;
	text-align: left; 
	margin:10px 0 10px 0; 
	padding:0; 
}

.sharediv a img{
	width:36px;
	height:auto;
	margin: 0 3px 0 0 ; 
	padding:0;	
}


}

@media only screen and (min-width:1200px){


.footeritem{
	width: 28%; 
	font-size:14px;
	line-height:25px;
	font-weight:300;
	color:#fff;
	margin:0 0 0 2%; 
	padding:0; 
	letter-spacing:1px;
	text-align: left; 
	float:left;
}


.footeritem a span{
	font-size:14px;
	font-weight:300;
	color:#fff;
	letter-spacing:1px;
}

.footeritem a{
	font-size:14px;
	font-weight:300;
	color:#fff;
	letter-spacing:1px;
	padding:0; 
}

.footeritem a img{
	height:65px;
	width:auto;
	margin:30px 0 20px -8px; 
	padding:0;
	border:0;	
}




.footeritem2{
	float:left;
	width: 70%;
	height:auto;
	margin:0; 
	padding:30px 0 0 0; 
	
}



.footeritem3{
	width: 100%;
	height:auto;
	text-align: center; 
	margin:30px 0 20px 0; 
	padding:0; 
	color:#a8a8a8;
	font-size:14px;
	font-weight:300;
	text-align: center; 
	letter-spacing:1px;
	font-family: 'Noto Sans', sans-serif;
}

.footeritem3 a{color:#ccc;}
.footeritem3 a:hover{color:#fff;}


.sharediv{
	width: 100%;
	height:auto;
	text-align: left; 
	margin:10px 0 10px 0; 
	padding:0; 
}

.sharediv a img{
	width:36px;
	height:auto;
	margin: 0 3px 0 0 ; 
	padding:0;	
}




}










.gvStyle{
	width:100%;
	margin:0; 
	text-align:left; 
}
        /*Header*/
.gvStyle th{
	border-bottom: 1px solid #ccc;
	font-size: 18px;
	font-weight: normal;
	height: 40px;
	color: #666666;
	background: #efefef;
}
.gvStyle th:hover
        {

 }
.gvStyle tr{
	border-bottom: 1px solid #ccc;
	height: 32px;
	font-size: 16px;
	padding: 3px;
}
        /*OnMouseOver*/
.gvStyle tr:hover{
	height: 32px;
	background: #efefef;
}	
        /*Rows*/
.gvStyle td{
	font-size: 16px;
        padding: 8px 0;   
	word-wrap:break-word; word-break:break-all;
}
        /*Change Rows*/
.gvStyle .alt{
            
}
        /*Page*/
.gvStyle .pgr table{
            
}
.gvStyle .pgr td{ 
	padding:0px 5px 0px 5px; 
} 
.gvStyle .pgr a{ 
        text-decoration:underline; 
} 
.gvStyle .pgr a:hover
        {

}




.gvStyleadd{
	width:100%;
	margin:10px 0 30px 0;
	border: 1px solid #ccc; 
	text-align:left; 
}
.gvStyleadd th{
	width:100%;
	background-color: #E6B9B8;
	font-size: 18px;
	font-weight: 700;
	height: auto;
	color: #65271D;
	padding:10px 20px;
	text-align:center;
}
.gvStyleadd th:hover
        {

 }

.gvStyleadd tr{
	background-color: #F7E9E9;
	height: 32px;
	font-size: 16px;
	word-wrap:break-word; 
	word-break:normal;
}

.gvStyleadd td{
	font-size: 16px;
	line-height: 180%;
	letter-spacing:1px;
	word-wrap:break-word; 
	word-break:300;  
	color:#65271D;
	padding:10px;       
}

.gvStyleadd td img{
	margin:3px;         
}

        /*Change Rows*/
.gvStyleadd .alt{
            
}
        /*Page*/
.gvStyleadd .pgr table{
            
}
.gvStyleadd .pgr td{ 
	padding:0px 5px 0px 5px; 
} 
.gvStyleadd .pgr a{ 
        text-decoration:underline; 
} 
.gvStyleadd .pgr a:hover
        {

}





.usergvStyle{
	width:98%;
	margin:1%;
}
.usergvStyle th{
	border-bottom: 1px solid #E1E1E1;
	font-size: 13px;
	font-weight: normal;
	height: 32px;
	color: #898989;
	text-align:center;
}
.usergvStyle th:hover
        {

 }
.usergvStyle tr{
	background-color: #ffffff;
	border-bottom: 1px solid #E1E1E1;
	height: 32px;
	font-size: 15px;
	word-wrap:break-word; 
	word-break:normal;
}
.usergvStyle tr:hover{
	background-color: #eeeeee;
	height: 32px;
}
.usergvStyle td{
	font-size: 14px;
	font-variant: normal;
	line-height: 25px;
	letter-spacing:1px;
	word-wrap:break-word; 
	word-break:normal;  
	color:#111;            
}

.usergvStyle td img{
	width:95%;
	height:auto;
	margin:2.5%;         
}

        /*Change Rows*/
.usergvStyle .alt{
            
}
        /*Page*/
.usergvStyle .pgr table{
            
}
.usergvStyle .pgr td{ 
	padding:0px 5px 0px 5px; 
} 
.usergvStyle .pgr a{ 
        text-decoration:underline; 
} 
.usergvStyle .pgr a:hover
        {

}





.usergvStyle2{
	width:98%;
	margin:1%;
	border: 1px solid #E1E1E1;
}
.usergvStyle2 th{
	border-bottom: 1px solid #E1E1E1;
	font-size: 13px;
	font-weight: normal;
	height: 32px;
	color: #898989;
	text-align:center;
}
.usergvStyle2 th:hover
        {

 }
.usergvStyle2 tr{
	background-color: #ffffff;
	border-bottom: 1px solid #E1E1E1;
	height: 32px;
	font-size: 15px;
	word-wrap:break-word; 
	word-break:normal;
}
.usergvStyle2 tr:hover{

}
.usergvStyle2 td{
	font-size: 14px;
	font-variant: normal;
	line-height: 25px;
	letter-spacing:1px;
	word-wrap:break-word; 
	word-break:normal;  
	color:#111;            
}

.usergvStyle2 td img{
	width:95%;
	height:auto;
	margin:2.5%;         
}

        /*Change Rows*/
.usergvStyle2 .alt{
            
}
        /*Page*/
.usergvStyle2 .pgr table{
            
}
.usergvStyle2 .pgr td{ 
	padding:0px 5px 0px 5px; 
} 
.usergvStyle2 .pgr a{ 
        text-decoration:underline; 
} 
.usergvStyle2 .pgr a:hover
        {

}


/*  會員  */

@media only screen and (max-width:768px){

.mbmenulist{
	width:100%
	height:auto;	
}

.mbmenulist a{
	display:block;
	margin: 0;
	padding:0 15px 10px 0;
	float:right;
	font-size: 14px;
	font-weight:700;
	line-height: 22px;
	color:#111;
	letter-spacing:1px;
}




}

@media only screen and (min-width:768px){

.mbmenulist{
	width:100%
	height:auto;	
}

.mbmenulist a{
	display:block;
	margin: 0;
	padding:0 20px 15px 0;
	float:right;
	font-size: 14px;
	font-weight:700;
	line-height: 22px;
	color:#111;
	letter-spacing:1px;
}




}


/*購物須知*/


@media only screen and (max-width:768px){
.knowbtitle{
	width:100%;
	text-align:center;
	margin: 20px 0 0 0;
	padding:0;
	font-size: 20px;
	font-weight:700;
	line-height: 35px;
	color:#333;
	letter-spacing:1px;	
}


.knowtitle{
	margin: 20px 0 0 0;
	padding:0;
	font-size: 16px;
	font-weight:700;
	line-height: 28px;
	color:#333;
	letter-spacing:1px;	
}

.knowdesc{
	margin: 10px 0 30px 0;
	padding:0;
	font-size: 16px;
	font-weight:300;
	line-height: 28px;
	color:#595959;
	letter-spacing:1px;
}


}

@media only screen and (min-width:768px){
.knowbtitle{
	width:100%;
	text-align:center;
	margin: 20px 0 0 0;
	padding:0;
	font-size: 20px;
	font-weight:700;
	line-height: 35px;
	color:#333;
	letter-spacing:1px;	
}

.knowtitle{
	width:100%;
	text-align:left;
	margin: 20px 0 0 0;
	padding:0;
	font-size: 16px;
	font-weight:700;
	line-height: 28px;
	color:#333;
	letter-spacing:1px;	
}

.knowdesc{
	width:100%;
	text-align:left;
	margin: 10px 0 50px 0;
	padding:0;
	font-size: 16px;
	font-weight:300;
	line-height: 28px;
	color:#595959;
	letter-spacing:1px;
}


}




/*  */

@media only screen and (max-width:768px){


}

@media (min-width: 768px) and (max-width:1200px) {



}

@media only screen and (min-width:1200px){



}





/*  */

@media only screen and (max-width:768px){
#fspage{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;
}

.indexpdlistdiv{
	width:100%;
	height:auto;
	padding:30px 0; 
	margin:20px 0 30px 0;
	background-color:#FE7974;
}

.indexnewslistdiv{
	width:95%;
	height:auto;
	padding:30px 0 60px 0; 
	margin:20px 2.5% 0 2.5%;
}

.mainbannerdiv{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	z-index:99;	
}

.mainbannerdiv img{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	border:0;
	z-index:99;	
}

.bnimg{
	margin:0;
	border:0;
	width:100%;
	text-align: center;
}

}

@media (min-width: 768px) and (max-width:1200px) {
#fspage{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;
}

.indexpdlistdiv{
	width:1100px;
	height:auto;
	padding:60px 0; 
	margin:20px 0 30px 0;
	background-color:#FE7974;
}

.indexnewslistdiv{
	width:1100px;
	height:auto;
	padding:60px 0 80px 0; 
	margin:20px 0 0 0;	
}

.mainbannerdiv{
	width:100%;
	height:auto;
	margin:0 auto;
	padding:0;
	text-align: center;
	z-index:99;	
}

.mainbannerdiv img{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	border:0;
	z-index:99;	
}

.bnimg{
	margin:0;
	border:0;
	width:1100px;
	text-align: center;
}

.bnimg img{
	margin:0;
	border:0;
	width:1100px;
}

.pddescimg{
	width:95% !important;
	height:auto !important;
	margin:0 2.5% !important;
	padding:0 !important;
	text-align: center !important;	
}

.pddescimg img{
	width:100% !important;
	height:auto !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;	
}

}

@media only screen and (min-width:1200px){
#fspage{
	width:100%;
	height:auto;
	padding:0; 
	margin:0;
}

.indexpdlistdiv{
	width:100%;
	height:auto;
	padding:60px 0; 
	margin:20px 0 30px 0;
	background-color:#FE7974;
}

.indexnewslistdiv{
	width:100%;
	height:auto;
	padding:60px 0 80px 0; 
	margin:20px 0 0 0;	
}

.mainbannerdiv{
	width:100%;
	height:auto;
	margin:0 auto;
	padding:0;
	text-align: center;
	z-index:99;	
}

.mainbannerdiv img{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	border:0;
	z-index:99;	
}

.bnimg{
	margin:0;
	border:0;
	width:1200px;
	text-align: center;
}

.bnimg img{
	margin:0;
	border:0;
	width:1100px;
}

.pddescimg{
	width:900px;
	height:auto;
	margin:0 auto;
	padding:0;
	text-align: center;	
}

.pddescimg img{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	border:0;	
}



}






/*  */
@media only screen and (max-width:768px){
.knowdiv{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
}

.knowdiv img{
	width:100% !important;
	height:auto !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;	
}

}

@media only screen and (min-width:768px){

.knowdiv{
	width:100%;
	height:auto;
	margin:0;
	padding:0;
}


}



.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0;
  height: 0;
  overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



.mv {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0;
  height: 0;
  overflow: hidden;
}

.mv iframe,
.mv object,
.mv embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*   */


@media only screen and (max-width:768px){

}

@media (min-width: 768px) and (max-width:1000px) {



#idxabout1_00{  
  position:relative;
  opacity: 0;	
  transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}

#idxabout2_00{  
  position:relative;
  opacity: 0;	
  transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}


}


@media only screen and (min-width:1000px){


#idxabout1_00{  
  position:relative;
  opacity: 0;	
  transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}

#idxabout2_00{  
  position:relative;
  opacity: 0;	
  transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}

#idxproduct_00{  
	position:relative;
	animation:zoomin .2s;
	-moz-animation:zoomin .2s;
	-webkit-animation:zoomin .2s;
	-o-animation:zoomin .2s;
	animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
}

#idxCatalogs_00{  
  position:relative;
  opacity: 0;	
  transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 800ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}


}



.onhover_out{
  opacity: 0;
  transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
}

.onhover_in{
  opacity: 1;
  transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -webkit-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -moz-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -o-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1) 0ms;
  -ms-transition: opacity 400ms cubic-bezier(0.25, 0.1, 0.25, 1)  0ms;
}

/*繞圈*/
.loader {
  position: absolute;
  z-index: 0;
  color: #A9A791;
  font-size: 20px;
  margin: 100px auto;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  text-indent: -9999em;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}
@keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}


.uploader{
animation:myfirst2 .2s;
-moz-animation:myfirst2 .2s;
-webkit-animation:myfirst2 .2s;
-o-animation:myfirst2 .2s;
animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;

}


@keyframes myfirst2
{
from	{top:60px;}
to	{top:0;}
}

@-moz-keyframes myfirst2 /* Firefox */
{
from	{top:60px;}
to	{top:0;}
}

@-webkit-keyframes myfirst2 /* Safari and Chrome */
{
from	{top:60px;}
to	{top:0;}
}

@-o-keyframes myfirst2 /* Opera */
{
from	{top:60px;}
to	{top:0;}
}




@keyframes myfirst
{
0%   {padding:60px 0 0 0!important;}
25%  {padding:45px 0 0 0!important;}
50%  {padding:30px 0 0 0!important;}
75%  {padding:15px 0 0 0!important;}
100% {padding:0!important;}
}

@-moz-keyframes myfirst /* Firefox */
{
0%   {padding:60px 0 0 0!important;}
25%  {padding:45px 0 0 0!important;}
50%  {padding:30px 0 0 0!important;}
75%  {padding:15px 0 0 0!important;}
100% {padding:0!important;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
0%   {padding:60px 0 0 0!important;}
25%  {padding:45px 0 0 0!important;}
50%  {padding:30px 0 0 0!important;}
75%  {padding:15px 0 0 0!important;}
100% {padding:0!important;}
}

@-o-keyframes myfirst /* Opera */
{
0%   {padding:60px 0 0 0!important;}
25%  {padding:45px 0 0 0!important;}
50%  {padding:30px 0 0 0!important;}
75%  {padding:15px 0 0 0!important;}
100% {padding:0!important;}
}


.on_zoomin{
	-webkit-animation: zoomin 0.3s;
    	animation: zoomin 0.3s;
}


@keyframes zoomin
{
0%   {transform: scale(0.1);}
25%  {transform: scale(0.4);}
50%  {transform: scale(0.7);}
75%  {transform: scale(1.2);}
100% {transform: scale(1);}
}

@-moz-keyframes zoomin /* Firefox */
{
0%   {transform: scale(0.1);}
25%  {transform: scale(0.4);}
50%  {transform: scale(0.7);}
75%  {transform: scale(1.2);}
100% {transform: scale(1);}
}

@-webkit-keyframes zoomin /* Safari and Chrome */
{
0%   {transform: scale(0.1);}
25%  {transform: scale(0.4);}
50%  {transform: scale(0.7);}
75%  {transform: scale(1.2);}
100% {transform: scale(1);}
}

@-o-keyframes zoomin /* Opera */
{
0%   {transform: scale(0.1);}
25%  {transform: scale(0.4);}
50%  {transform: scale(0.7);}
75%  {transform: scale(1.2);}
100% {transform: scale(1);}
}



.on_leftin{
	-webkit-animation: leftin 0.4s;
    	animation: leftin 0.4s;
    	-webkit-transition-delay:1s;
    	-moz-transition-delay:1s;
}


@keyframes leftin
{
0%   {margin-left:-300px;opacity: 0;}
10%  {margin-left:-270px;opacity: 0.1;	}
20%  {margin-left:-240px;opacity: 0.2;	}
30%  {margin-left:-210px;opacity: 0.3;	}
40%  {margin-left:-180px;opacity: 0.4;	}
50%  {margin-left:-150px;opacity: 0.5;	}
60%  {margin-left:-120px;opacity: 0.6;	}
70%  {margin-left:-90px;opacity: 0.7;	}
80%  {margin-left:-60px;opacity: 0.8;}
90%  {margin-left:-30px;opacity: 0.9;}
100% {margin-left:0px;opacity: 1;}
}

@-moz-keyframes leftin /* Firefox */
{
0%   {margin-left:-300px;opacity: 0;}
10%  {margin-left:-270px;opacity: 0.1;	}
20%  {margin-left:-240px;opacity: 0.2;	}
30%  {margin-left:-210px;opacity: 0.3;	}
40%  {margin-left:-180px;opacity: 0.4;	}
50%  {margin-left:-150px;opacity: 0.5;	}
60%  {margin-left:-120px;opacity: 0.6;	}
70%  {margin-left:-90px;opacity: 0.7;	}
80%  {margin-left:-60px;opacity: 0.8;}
90%  {margin-left:-30px;opacity: 0.9;}
100% {margin-left:0px;opacity: 1;}
}

@-webkit-keyframes leftin /* Safari and Chrome */
{
0%   {margin-left:-300px;opacity: 0;}
10%  {margin-left:-270px;opacity: 0.1;	}
20%  {margin-left:-240px;opacity: 0.2;	}
30%  {margin-left:-210px;opacity: 0.3;	}
40%  {margin-left:-180px;opacity: 0.4;	}
50%  {margin-left:-150px;opacity: 0.5;	}
60%  {margin-left:-120px;opacity: 0.6;	}
70%  {margin-left:-90px;opacity: 0.7;	}
80%  {margin-left:-60px;opacity: 0.8;}
90%  {margin-left:-30px;opacity: 0.9;}
100% {margin-left:0px;opacity: 1;}
}

@-o-keyframes leftin /* Opera */
{
0%   {margin-left:-300px;opacity: 0;}
10%  {margin-left:-270px;opacity: 0.1;	}
20%  {margin-left:-240px;opacity: 0.2;	}
30%  {margin-left:-210px;opacity: 0.3;	}
40%  {margin-left:-180px;opacity: 0.4;	}
50%  {margin-left:-150px;opacity: 0.5;	}
60%  {margin-left:-120px;opacity: 0.6;	}
70%  {margin-left:-90px;opacity: 0.7;	}
80%  {margin-left:-60px;opacity: 0.8;}
90%  {margin-left:-30px;opacity: 0.9;}
100% {margin-left:0px;opacity: 1;}
}


.on_bottomin{
	-webkit-animation: bottomin 0.4s;
    	animation: bottomin 0.4s;
}


@keyframes bottomin
{
0%   {padding-top:100px;opacity: 0;}
10%  {padding-top:90px;opacity: 0.1;}
20%  {padding-top:80px;opacity: 0.2;}
30%  {padding-top:70px;opacity: 0.3;}
40%  {padding-top:60px;opacity: 0.4;}
50%  {padding-top:50px;opacity: 0.5;}
60%  {padding-top:40px;opacity: 0.6;}
70%  {padding-top:30px;opacity: 0.7;}
80%  {padding-top:20px;opacity: 0.8;}
90%  {padding-top:10px;opacity: 0.9;}
100% {padding-top:0px;opacity: 1;}
}

@-moz-keyframes bottomin /* Firefox */
{
0%   {padding-top:100px;opacity: 0;}
10%  {padding-top:90px;opacity: 0.1;}
20%  {padding-top:80px;opacity: 0.2;}
30%  {padding-top:70px;opacity: 0.3;}
40%  {padding-top:60px;opacity: 0.4;}
50%  {padding-top:50px;opacity: 0.5;}
60%  {padding-top:40px;opacity: 0.6;}
70%  {padding-top:30px;opacity: 0.7;}
80%  {padding-top:20px;opacity: 0.8;}
90%  {padding-top:10px;opacity: 0.9;}
100% {padding-top:0px;opacity: 1;}
}

@-webkit-keyframes bottomin /* Safari and Chrome */
{
0%   {padding-top:100px;opacity: 0;}
10%  {padding-top:90px;opacity: 0.1;}
20%  {padding-top:80px;opacity: 0.2;}
30%  {padding-top:70px;opacity: 0.3;}
40%  {padding-top:60px;opacity: 0.4;}
50%  {padding-top:50px;opacity: 0.5;}
60%  {padding-top:40px;opacity: 0.6;}
70%  {padding-top:30px;opacity: 0.7;}
80%  {padding-top:20px;opacity: 0.8;}
90%  {padding-top:10px;opacity: 0.9;}
100% {padding-top:0px;opacity: 1;}
}

@-o-keyframes bottomin /* Opera */
{
0%   {padding-top:100px;opacity: 0;}
10%  {padding-top:90px;opacity: 0.1;}
20%  {padding-top:80px;opacity: 0.2;}
30%  {padding-top:70px;opacity: 0.3;}
40%  {padding-top:60px;opacity: 0.4;}
50%  {padding-top:50px;opacity: 0.5;}
60%  {padding-top:40px;opacity: 0.6;}
70%  {padding-top:30px;opacity: 0.7;}
80%  {padding-top:20px;opacity: 0.8;}
90%  {padding-top:10px;opacity: 0.9;}
100% {padding-top:0px;opacity: 1;}
}


.go_top_in{
	-webkit-animation: top_in 0.8s linear;
  	animation: top_in 0.8s linear;
}

.go_bottom_in{
	-webkit-animation: bottom_in 0.8s linear;
  	animation: bottom_in 0.8s linear;
}

.go_left_in{
	-webkit-animation: left_in 0.8s linear;
  	animation: left_in 0.8s linear;
}

.go_right_in{
	-webkit-animation: right_in 0.8s linear;
  	animation: right_in 0.8s linear;
}


@keyframes top_in {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes bottom_in {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes left_in {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes right_in {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}

/*  */

@media only screen and (max-width:768px){


}

@media (min-width: 768px) and (max-width:1200px) {



}

@media only screen and (min-width:1200px){



}



/*  */

@media only screen and (max-width:768px){


}

@media (min-width: 768px) and (max-width:1200px) {



}

@media (min-width: 1200px) and (max-width:1400px) {



}

@media only screen and (min-width:1400px){



}



